Как назначить уникальный контроллер $last в AngularJS?

Во-первых, я новичок в AngularJS, поэтому, пожалуйста, потерпите меня. Я читал документацию и работал с некоторыми онлайн-учебниками, чтобы попытаться понять хотя бы основы, но этот конкретный вопрос поставил меня в тупик. Я даже не уверен, что то, что я хочу сделать, возможно. Я занимался этим в течение двух дней и пробовал множество решений, включая изоляцию последнего ‹li› по его свойству name, использование классического цикла for для повторения других, использование angular forEach для цикла остальных и т. д. Я надеюсь кто-то здесь может мне помочь.

У меня есть сгенерированный ng-repeat список элементов («свеча в свечах») с простым переключателем для выбора/отмены выбора каждого элемента и «общим» контроллером для суммирования выбранных элементов. Что я хочу сделать, так это изолировать последний элемент ‹li› с помощью $last и привязать уникальный переключатель «очистить все предыдущие» к этому элементу $last. Когда выбрано (или «активно»), контроллер только для последнего элемента должен просмотреть предыдущие элементы и отменить выбор всех выбранных (таким образом, также удалив их из общего числа). Другими словами, последний элемент должен действовать как щелчок «очистить все предыдущие выборы», а также как самопереключение.

Класс «последний» отображается так, как должен, но мне трудно изолировать его и привязать к своей собственной функции. Между тем, поскольку общий переключатель продолжает работать, я получаю «тихие сбои», которые не дают никаких подсказок консоли о том, что я делаю неправильно.

Вот мой код: http://jsfiddle.net/codesushi156/tKZjZ/215/ Я прокомментировал, чтобы указать часть, которая терпит неудачу:

    function OrderFormController($scope){

    $scope.candles = [
        {
            name: 'Aromatherapy Collection',
            items: 'Amber Sandalwood, Goddess, Lavender, Love, Patchouli Pear',
            price: 45,
            active:true
        },{
            name: 'Fruit Collection',
            items: 'Dreamy Orange, Bliss, Love Spell',
            price: 27.5,
            active:false
        },{
            name: 'Holiday Collection',
            items: 'Candy Cane, Chocolate Mint Truffle, Chocolate Vanilla, Cranapple Spice, Christmas Tree, Home for the Holidays, Pumpkin Spice',
            price: 63.5,
            active:false
        },{
            name: 'Wine Collection',
            items: 'Cabernet, Chardonnay, Raspberry Truffle Chardonnay',
            price: 27.5,
            active:false
        },{
            name: 'All Four Collections',
            items: 'Save even more! Includes the Aromatherapy, Fruit, Holiday and Wine Collections listed above in one package.',
            price: 156,
            active:false
        }
    ];

    // THIS IS THE PART NOT WORKING
    $last = function(s){
        angular.forEach($scope.candles, function(){
                $removeClass('active');
        });
        this.toggleActive();
    };
    // END PART NOT WORKING

    $scope.toggleActive = function(s){
        s.active = !s.active;
    }

    // Calculate total price:
    $scope.total = function(){
        var total = 0;
        angular.forEach($scope.candles, function(s){
            if (s.active) {
                total+= s.price;
            }
        });
        return total;
    };
}

Будем очень благодарны любой помощи. Спасибо!


person code-sushi    schedule 09.03.2014    source источник
comment
Вы хотите удалить все остальные элементы из списка?   -  person Poyraz Yilmaz    schedule 09.03.2014
comment
Нет, не удалять их, просто отменить выбор, если выбран последний элемент.   -  person code-sushi    schedule 10.03.2014


Ответы (1)


Это должно делать то, что вы хотите.

http://jsfiddle.net/tKZjZ/216/

Я не вижу причин, по которым вам нужен другой контроллер для этого. $last — это логическое свойство изолированной области в элементах ng-repeat. Вы можете передать его своей функции toggleActive, чтобы определить, что делать.

Также я предполагаю, что вы, вероятно, также хотите, чтобы он очищал последний элемент, если выбран один из предыдущих элементов. Вы даже можете захотеть, чтобы он автоматически выбирал последний элемент, если они выбирают все предыдущие элементы. Тебе решать.

person Chris Nicola    schedule 09.03.2014
comment
Спасибо, Крис, очень полезно! Другие ваши предложения тоже звучат хорошо, но я посмотрю, смогу ли я понять их самостоятельно. Не в первый раз я что-то упускаю из-за того, что слишком много обдумываю (или думаю в неправильном направлении). Спасибо еще раз. - person code-sushi; 10.03.2014
comment
Без проблем. Angular иногда может быть довольно запутанным. - person Chris Nicola; 10.03.2014