Сохранение строк в массиве при выборе пользователем флажка

#javascript #angularjs #arrays

#javascript #angularjs #массивы

Вопрос:

Я только начал использовать angularJS и пытаюсь научиться вставлять строки в массив, когда пользователь нажимает флажок, а затем получать доступ к этим значениям.

Это то, что у меня есть до сих пор:

 <md-button class="toolbar-button" ng-click="removePlan()">
    <md-icon>delete</md-icon>
</md-button>    
<md-list-item ng-repeat="plan in plans">
        <md-checkbox ng-model="plansSelected[plan._id]"> </md-checkbox>
    </md-list-item>
  

apps.js

 $scope.plansSelected = []
$scope.removePlan = function () {
   for (var plan in $scope.plansSelected) {
      if ($scope.plansSelected[plan] === true) {
          projectResource.removePlan(plan).then(function (data) {
            if (data.success) {
              $scope.plans.push(data.plan)
            }
          })
      }
   }
}
  

projectResource.js

 resource.removePlan = function (planId) {
     return $http.delete(getPlanUrl(planId)).then(processResponse, processError)
} 

function getPlansUrl () {
    return getProjectUrl()   '/plans'
  }

  function getPlanUrl () {
    return getPlansUrl()   '/'   $route.current.params.planId
  }
  

В отладчике вот как выглядит мой массив:

 $scope.plansSelected: Array[0]
57bd40128a58022800887d80:false
57bd40328a58022800887d88:false
57cc2bcbb452140500b0334a:false
  

Я проверяю, снял ли пользователь выделение с флажка, и если значение равно true, тогда возьмите этот plan._id и передайте в цикле в removePlan функцию.

Кто-нибудь видит, что я делаю неправильно, потому что это не работает.

Ответ №1:

Пожалуйста, уточните, что означает «это не работает» — нам трудно обнаружить это, не имея возможности запустить его.

Я вижу, что ваше использование $scope.plansSelected в качестве пустого массива неверно. Я бы отказался от этого и сделал это следующим образом:

 <md-list-item ng-repeat="plan in plans track by $index">
    {{plan.name}} <md-checkbox ng-model="plans[$index].selected"> </md-checkbox>
</md-list-item>
  

Это в основном добавляет атрибут ‘selected’ к вашему массиву plans и упрощает вам перебор по массиву plans и извлекает те, которые вы хотите.