使用AngularJS，如何利用ng-show對數組進行查找以找到某些值？

Question

我有一個模型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.user在program.permissions.user且具有讀取器，編輯器或admin的角色，我想顯示一個圖標。 我當時正在考慮進行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;

};

Answer 1

雖然不是最漂亮，但您可以使用||明確檢查您的值。 使用indexOf（）在ng-show進行邏輯運算符。 我嘲笑了一個簡單的示例，將<span>用作“圖標”-但您當然可以從這里將其應用到工作副本中。 注意以下幾點...

<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-簡單演示

---

您可以完成的另一種有趣的方法可能包括通過正則表達式測試其角色並返回真實值。 可能會產生超出其價值的開銷，但是如果您願意，請查看...

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

---

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

JSFiddle Link-正則表達式演示

Answer 2

我能夠弄清楚。

我在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;

};