angularjs флажок добавить к области переменной

Question

У меня есть таблица следующим образом:

<tr ng-repeat="user in users"> 
     <td>{{user.fields.first_name}}, {{ user.fields.last_name }}</td> 
     <td> 
      <input type="checkbox"> 
     </td> 
    </tr> 

и JSON выглядит следующим образом:

{ 
    "users": 
    [ 
     { "fields": {"first_name": "sam", "last_name": "smith"}, "model": "auth.user", "pk": 3}, 
     { "fields": {"first_name": "tom", "last_name": "moody"}, "model": "auth.user", "pk": 4} 
    ] 
} 

Я хочу иметь функциональные возможности для добавления pk's из выбранного установите флажки в переменную области видимости. Поскольку у меня нет логического поля для выбранного в моем json, как я подхожу к этому?

Answer 1

Или вы можете попробовать с нг-изменения, что является немного более элегантный имо:

var app = angular.module('app', []); 
 

 
app.controller('AController', function($scope) { 
 
    
 
$scope.users = [ 
 
    { "fields": {"first_name": "wasif", "last_name": "abbas"}, "model": "auth.user", "pk": 3}, 
 
    { "fields": {"first_name": "asad", "last_name": "zaman"}, "model": "auth.user", "pk": 4} 
 
]; 
 

 
$scope.selectedUsers = {}; 
 

 
$scope.addUser = function(pk, userselected) { 
 
    if(userselected) { 
 
     $scope.selectedUsers[pk] = true; 
 
    } else { 
 
     delete $scope.selectedUsers[pk]; 
 
    } 
 
} 
 

 
$scope.getSelectedUsersArray = function() { 
 
    return Object.keys($scope.selectedUsers); 
 
} 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app="app"> 
 
<div ng-controller="AController"> 
 
    <table> 
 
     <tr ng-repeat="user in users"> 
 
      <td>{{user.fields.first_name}}, {{ user.fields.last_name }}</td> 
 
      <td> 
 
       <input type="checkbox" ng-model="userselected" ng-change="addUser(user.pk, userselected)"/> 
 
      </td> 
 
     </tr> 
 
    </table> 
 
    <div>Selected: {{getSelectedUsersArray()}}</div> 
 
</div> 
 
</div>

Answer 2

Вы можете попробовать код в моей скрипке, выбранные ПК хранятся в вызове массива «выбрано». Pk должен быть уникальным для каждого пользователя.

var app = angular.module('app', []); 
 
var ctrl = app.controller('MyCtrl', function($scope) { 
 
    $scope.users = [{ 
 
    "fields": { 
 
     "first_name": "wasif", 
 
     "last_name": "abbas" 
 
    }, 
 
    "model": "auth.user", 
 
    "pk": 3 
 
    }, { 
 
    "fields": { 
 
     "first_name": "asad", 
 
     "last_name": "zaman" 
 
    }, 
 
    "model": "auth.user", 
 
    "pk": 4 
 
    }, { 
 
    "fields": { 
 
     "first_name": "hes", 
 
     "last_name": "man" 
 
    }, 
 
    "model": "auth.user", 
 
    "pk": 5 
 
    }]; 
 

 
    $scope.selected = []; 
 
    $scope.toggleSelection = function toggleSelection(pk) { 
 
    var idx = $scope.selected.indexOf(pk); 
 

 
    // is currently selected 
 
    if (idx > -1) { 
 
     $scope.selected.splice(idx, 1); 
 
    } 
 

 
    // is newly selected 
 
    else { 
 
     $scope.selected.push(pk); 
 
    } 
 
    }; 
 

 
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app="app"> 
 
    <div ng-controller='MyCtrl'> 
 
    <table> 
 
     <tr ng-repeat="user in users"> 
 
     <td>{{user.fields.first_name}}, {{ user.fields.last_name }}</td> 
 
     <td> 
 
      <input type="checkbox" ng-checked="selected.indexOf(user.pk) > -1" ng-click="toggleSelection(user.pk)" /> 
 
     </td> 
 
     </tr> 
 
    </table> 
 
    Selected: {{selected}} 
 
    </div> 
 
</div>