使用 AngularJS,我如何利用 ng-show 对数组查找某些值?

With AngularJS, how can I leverage ng-show against an array to find certain values?

我有一个模型,Program,看起来像这样

var ProgramSchema = new Schema({
  permissions: [{
      user: {
        type: Schema.ObjectId,
        ref: 'User'
      },
      roles: {
        type: [{
            type: String,
            enum: ['reader', 'editor', 'admin', 'requested']
          }]
      }
    }],
  type: {
    type: String,
    enum: ['public', 'private'],
    default: 'public',
    required: 'Type cannot be blank'
  }
});

在页面上显示 programs 的列表,如果当前经过身份验证的用户 $scope.authentication.userprogram.permissions.user 中并且具有 [= 的角色,我想显示一个图标35=]、编辑或管理员。 我在想一个 ng-show 但由于 programs.permissions 是一个数组,我无法让它工作。 任何帮助都会很棒!谢谢!

样本program数据

{
    "_id" : ObjectId("55ab4acd24640cd55097c356"),
    "permissions" : [ 
        {
            "user" : ObjectId("55a897dfad783baa677e1326"),
            "roles" : [ 
                "reader"
            ]
        }, 
        {
            "user" : ObjectId("5563f65a84426d913ae8334e"),
            "roles" : [ 
                "editor"
            ]
        }
    ]
}

通过一些帮助,这是我最终做的事情

我在我的 ng-show 中调用了一个函数

ng-show="userFollowedProgram(program)"

在我的控制器中

$scope.userFollowedProgram = function(program) {
  //loop thru permissions and see if user is in there.
  for (var i = 0; i < program.permissions.length; i++) {
    if (program.permissions[i].user === $scope.authentication.user._id) {
      //loop thru roles and see if user is following.
      if (program.permissions[i].roles.indexOf('admin') > -1 ||
          program.permissions[i].roles.indexOf('editor') > -1 ||
          program.permissions[i].roles.indexOf('reader') > -1) {
          return true
        }
    }
  }
  return false;

};

虽然不是最漂亮的,但您可以使用 indexOf()ng-show 上使用 || 逻辑运算符明确检查您的值。我嘲笑了一个简单的例子,使用 <span> 作为 "icon" - 但你当然可以从这里将这个想法应用到你的工作副本中。观察以下...

<li ng-repeat="user in users">
    <span>{{ user.name }}</span>
    <span class="ico" 
          ng-show="user.roles.indexOf('reader') > -1 || user.roles.indexOf('editor') > -1 || user.roles.indexOf('admin') >-1">icon
    </span>
</li>

$scope.users = [{
        id: 1, name: 'bob', roles: ['reader', 'editor', 'admin']
    },{
        id: 2, name: 'jane', roles: ['reader']
    },{
        id: 3, name: 'chris', roles: ['editor']
    },{
        id: 4, name: 'susy', roles: ['requested'] // sorry susy
}];

JSFiddle Link - 简单演示


您可以完成的另一种有趣的方式包括通过正则表达式和 return 真实值测试它们的角色。开销可能比它的价值更多,但如果您愿意,请检查一下...

<span class="ico" ng-show="isInRole(user)" >icon</span>

$scope.isInRole = function(user) {
    return /(reader|editor|admin)/.test(user.roles.join('|'));
}

JSFiddle Link - 正则表达式演示

我想通了。

我在 ng-show

中调用了一个函数
ng-show="userFollowedProgram(program)"

在我的控制器中

$scope.userFollowedProgram = function(program) {
  for (var i = 0; i < program.permissions.length; i++) {
    if (program.permissions[i].user === $scope.authentication.user._id) {
      return true;
    }
  }
  return false;

};