AngularJS配列の比較

Question

私は、ユーザー名

Usernames = [ 
    { 
    "id": 1, 
    "userName": "Jack", 
    "description": "jack is a nice guy", 
    "userRoleIds": [ 
     1 
    ] 
    }, 
    { 
    "id": 2, 
    "userName": "Caroline", 
    "description": "Good girl", 
    "userRoleIds": [ 
     2,3 
    ] 
    }, 
    { 
    "id": 3, 
    "userName": "Smith", 
    "description": "Smithyyyy", 
    "userRoleIds": [ 
     1,2 
    ] 
    } 
] 

そしてuserRolesの配列の次の配列を持っています。

userRoles = [ 
    { 
    id: 1, 
    roleName: "Admin" 
    }, 
    { 
    id: 2, 
    roleName: "Tester" 
    }, 
    { 
    id: 3, 
    roleName: "Developer" 
    } 
] 

私がやりたいことは、最初にUsernamesとuserRolesの配列を連結して次の結果を得ることです。

Usernames = [ 
     { 
     "id": 1, 
     "userName": "Jack", 
     "description": "jack is a nice guy", 
     "userRoleIds": [ 
      { 
      "id": 1, 
      "roleName" : "Admin" 
      } 
     ] 
     }, 
    { 
    "id": 2, 
    "userName": "Caroline", 
    "description": "Good girl", 
    "userRoleIds": [ 
     { 
      "id": 2, 
      "roleName" : "Tester" 
      }, 
      { 
      "id": 3, 
      "roleName" : "Developer" 
      } 
    ] 
    },... 

私がしたい2つ目は、パイプ記号で区切らroleNameとuserNameをフィルタリングすることができることです。例えば、userNameとroleNameを検索するテキストボックスの中の何かをタイプします。

私は

Caroline, Tester

を入力する場合、結果はこれを達成するためのベストプラクティスは何

result = [ 
    { 
    "id": 2, 
    "userName": "Caroline", 
    "description": "Good girl", 
    "userRoleIds": [ 
     2,3 
    ] 
    }, 
    { 
    "id": 3, 
    "userName": "Smith", 
    "description": "Smithyyyy", 
    "userRoleIds": [ 
     1,2 
    ] 
    } 
] 

でしょうか？ここで

おかげ

Answer 1

は、私はそれを行うだろうかです。私はサービスを使い、その機能を利用してコードをきれいに保つことを好む。

app.service('UserService', function (PermisionsServices) { 
    var self = { 
     'list': [], 
     'load': function (Users) {//Pass your array of Users 
      angular.forEach(Users, function (user) { 
       angular.forEach(user.userRoleIds, function (role) { 
        self.user.userRolesIds.push(PermisionsServices.get(role)); 
       }); 
       self.list.push(user); 
      }); 
     }, 'get': function (id) { 
      for (var i = 0; i < self.list.length; i++) { 
       var obj = self.list[i]; 
       if (obj.id == id) { 
        return obj; 
       } 
      } 
     } 
    }; 
    return self; 
}); 

app.service('PermisionsServices', function() { 
    var self = { 
     'list': [], 
     'load': function (permisions) {//Pass your array of permisions 
      angular.forEach(permisions, function (permision) { 
       self.list.push(permision); 
      }); 
     }, 'get': function (id) { 
      for (var i = 0; i < self.list.length; i++) { 
       var obj = self.list[i]; 
       if (obj.id == id) { 
        return obj; 
       } 
      } 
     } 
    }; 
    return self; 
}); 

その後、あなたはあなたのコントローラ上でそれを使用することができます。 $ scope.users = UserServiceの。

複数のオブジェクトパーミッションを持つことができる個別のオブジェクトとして各ユーザーにアクセスします。

注：サービスをビルドすることはもちろんアプリケーションロジックとコントローラに依存しますが、単に「ロード」機能を削除し、配列オブジェクトをコピーして貼り付けるだけでリストオブジェクトをハードコードすることができます。

これは、リソースからAPIからデータを読み込むために使用するアプローチです。

よろしく

編集：UI上で使用するために 、あなただけ呼び出します。

<div ng-repeat='user in users.list'> 
    {{user.name}} has {{user.permissions}} 
</div> 

オブジェクト情報がすでにその中に含まれているとして。

編集2： あなたのデータを検索したい場合は、あなたはこのようにフィルタを追加することができます：コントローラ上の

<div ng-repeat='user in users.list | filter: filterList'> 
     {{user.name}} has {{user.permissions}} 
</div> 

そして：

$scope.filterList = function (user) { 
     if ($scope.filterTextBox) { 
      return user.name.indexOf($scope.filterTextBox) == 0; 
     } 

     return true; 
    } 

希望、これがために働きますあなた

Answer 2

これを達成するためにlodashを使用することができます。

var role = _.find(userRoles, function(role) { 
      return role.roleName == 'Tester'; 
     }); 
_.find(Usernames, function(user) { 
    return user.userName == 'Caroline' || _.indexOf(user.userRoleIds, role.id)>=0; 
}); 

Answer 3

私はこのような純粋なJSでやります。それぞれに1つ以上の割り当て線を必要としません。

var Usernames = [ 
 
    { 
 
    "id": 1, 
 
    "userName": "Jack", 
 
    "description": "jack is a nice guy", 
 
    "userRoleIds": [ 
 
     1 
 
    ] 
 
    }, 
 
    { 
 
    "id": 2, 
 
    "userName": "Caroline", 
 
    "description": "Good girl", 
 
    "userRoleIds": [ 
 
     2,3 
 
    ] 
 
    }, 
 
    { 
 
    "id": 3, 
 
    "userName": "Smith", 
 
    "description": "Smithyyyy", 
 
    "userRoleIds": [ 
 
     1,2 
 
    ] 
 
    } 
 
], 
 
userRoles = [ 
 
    { 
 
    id: 1, 
 
    roleName: "Admin" 
 
    }, 
 
    { 
 
    id: 2, 
 
    roleName: "Tester" 
 
    }, 
 
    { 
 
    id: 3, 
 
    roleName: "Developer" 
 
    } 
 
], 
 
modified = Usernames.reduce((p,c) => (c.userRoleIds = c.userRoleIds.map(e => e = userRoles.find(f => f.id == e)),p.concat(c)),[]), 
 
    query = ["Caroline","Tester"], 
 
filtered = modified.filter(f => query.includes(f.userName) || f.userRoleIds.some(e => query.includes(e.roleName))); 
 
console.log(JSON.stringify(modified,null,2)); 
 
console.log(JSON.stringify(filtered,null,2));