Question

我需要你帮助AngularJS。我必须模拟这种情况：我有两个select。第一个用于选择“主要用户”。另一个用于选择“次要用户”。当我从第一个select获取用户时，我必须将该用户隐藏在第二个select中。这是我的（剪切）html：

<div data-ng-controller="appointmentsController">
     <!-- stuff stuff stuff -->
     <div data-ng-controller="usersController">
         <select id="appointments-users" data-ng-change="changeMainUser()" data-ng-options="userith.ID as userith.lastName for userith in users" data-ng-model="selectedUserID.ID">
              <option value="">Scegli utente principale...</option>
         </select>

         <select id="appointments-secondary-users" multiple data-ng-multiple="true" data-ng-model="secondaryUserIDs.IDs">
             <option data-ng-repeat="userith in users" data-ng-hide="userith.ID === selectedUserID.ID" value="{{userith.ID}}">{{userith.lastName}}</option>
         </select>
     </div>
     <!-- stuff stuff stuff -->
</div>

usersController是一个简单的控制器，包含一个名为“users”的用户数组。 appointmentsController包含许多这两个对象：

$scope.selectedUserID = {
    ID: $scope.$parent.user.ID
};
$scope.secondaryUserIDs = {
    IDs: null
};

不幸的是，第二个选择中的data-ng-hide似乎被忽略了。我需要你的帮助来理解原因。先感谢您。

编辑：感谢Maxim Shoustin的建议我为我的角应用创建了一个过滤器，我使用该过滤器来显示/隐藏正确的二级用户。我这样做了：

<div data-ng-controller="appointmentsController">
         <!-- stuff stuff stuff -->
         <div data-ng-controller="usersController">
             <select id="appointments-users" data-ng-change="changeMainUser()" data-ng-options="userith.ID as userith.lastName for userith in users" data-ng-model="selectedUserID.ID">
                  <option value="">Scegli utente principale...</option>
             </select>

             <select id="appointments-secondary-users" multiple data-ng-multiple="true" data-ng-model="secondaryUserIDs.IDs">
                 <option data-ng-repeat="userith in users | usersFilter: selectedUserID.ID" value="{{userith.ID}}">{{userith.lastName}}</option>
             </select>
         </div>
         <!-- stuff stuff stuff -->
    </div>

这是链接到我的角应用的过滤器：

app.filter('usersFilter', function() {
   return function( items, types) {
    var filtered = [];

    angular.forEach(items, function(item) {
        if(item.ID !== types){
            filtered.push(item);
        }
    });

    return filtered;
  };
});

如何使用ng-repeat和ng-hide（用于html选择）

0 个答案: