установите флажок, нажав на ссылку в angularJs

Question

установите флажок, нажав на ссылку в angularJs

0

У меня есть следующий код:

<li ng-repeat="item in items">
    <a href="#" ng-if="!item.children" ng-click="checkItem(item,checkBoxModel)">
        <input class="align"
               ng-click="checkItem(item,checkBoxModel)"
               type="checkbox" ng-checked="master"
               ng-model="checkboxModel"/>     
                 {{ item.title }}                 
     </a>
</li>

в моем контроллере у меня есть функция checkItem:

$scope.checkItem = function(item, checkBoxModel) {
    if (checkBoxModel == undefined || checkBoxModel == true) {
        ....        
        $scope.master=true;
        $scope.checkBoxModel = false;*
    } else {
        ....
        $scope.master = false;
        $scope.checkBoxModel = true;
    }
}

Проблема в том, что когда я нажимаю на ссылку, все флажки проверяются. Я просто хочу, чтобы флажок, связанный с ссылкой, был проверен.

Fadwa 02 июль 2015, в 17:40

Источник

Теги:

angularjs

3 ответа

1

Вместо того, чтобы устанавливать master значений в объекте объекта $scope контроллеров, установите его на фактический элемент, который вы проходите, и установите его ng-checked="item.master" а он ng-model="item.checkBoxModel"

$scope.checkItem = function(item, checkBoxModel) {
    if (checkBoxModel == undefined || checkBoxModel == true) {
        ....        
        item.master=true;
        item.checkBoxModel = false;
    } else {
        ....
        item.master = false;
        item.checkBoxModel = true;
    }
}

Tom 02 июль 2015, в 13:32

1

Просто понял, что мой ответ был в основном таким же, как ваш. Имейте upvote.
ryanyuyu 02 июль 2015, в 15:28

1

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

Что-то вроде этого:

app.js

$scope.items = [
    {
        name: 'example',
        master: false,
        checkboxModel: false
    },
    {
        name: 'example',
        master: false,
        checkboxModel: false
    }
];

$scope.checkItem = function(item, checkBoxModel) {
    if (checkBoxModel == undefined || checkBoxModel == true) {
        ....        
        $scope.items[item].master = true;
        ...
    } else {
        ....
        $scope.items[item].master = false;
        ...
    }
}

index.html

<input class="align"
                   ng-click="checkItem(item, checkBoxModel)"
                   type="checkbox" ng-checked="item.master"
                   ng-model="item.checkboxModel"/>

hsynlms 02 июль 2015, в 13:24

0

Примечание: поскольку вы передаете элемент checkItem(item...) , вам не нужно делать $scope.items[item] - просто сделайте работу над item
Tom 02 июль 2015, в 15:30
0

да, я знаю. но оба работают. удаление занимает несколько секунд, если кто-то хочет :) Кстати, спасибо.
hsynlms 02 июль 2015, в 15:33

Ещё вопросы

Просто понял, что мой ответ был в основном таким же, как ваш. Имейте upvote.
Примечание: поскольку вы передаете элемент checkItem(item...) , вам не нужно делать $scope.items[item] - просто сделайте работу над item
да, я знаю. но оба работают. удаление занимает несколько секунд, если кто-то хочет :) Кстати, спасибо.

Fadwa · Accepted Answer · 2015-07-05T16-18-00.000Z

<li ng-repeat="item in items">
<a href="#" ng-if="!item.children" ng-click="checkItem(item)">
    <input class="align"
           ng-click="checkItem(item)"
           type="checkbox" ng-checked="item.checked"
          />     
             {{ item.title }}                 
 </a>

в моем контроллере я изменяю значение item.checked