angularjs를 사용하여 드롭 다운에서 특정 역할 기반 사용자 이름을 필터링하는 방법은 무엇입니까?

Question

각도 j를 사용하여 드롭 다운에서 특정 역할 기반 사용자 이름을 필터링하는 방법은 무엇입니까?

안녕하세요 모두 KP 역할 사용자 이름을 드롭 다운하고 싶습니다.

• 참고로 My plunker을 확인하십시오.

• 먼저 all Rolesdrop down을 작성한 다음 드롭 다운을 all username 작성했습니다.

• 내가 정확히 찾고있는 것은 kp 사용자의 역할은 John and Francis입니다. 그래서이 kp 명의 사용자를 드롭 다운하여 필터링하고 싶습니다.

• 그래서 나는 다음과 같은 필터를 만들었습니다. filter : user.roles == 'kp'그것은 나를 위해 일하지 않습니다. 그래서 우리를 도와주세요.

내 HTML : -

<div> 
    <p>There are various of roles are available like:-</p> 
    <p><b>[admin,school_student,block,kp]</b>.</p> 
     <label>1. All Roles </label> 
     <select ng-model="Filterkp" ng-options="item.roles for item in users"> 
     </select> 
</div> 

<div> 
    <label>2. All Roles User Name</label> 
    <select ng-model="Filterkp" ng-options="item.username for item in users"> 
    </select> 
</div> 


<div> 
    <p>3. How to filter roles of KP username in this dropdown</p> 
    <lable>I tried filter like :- <b>| filter:user.roles == 'kp'</b></lable> 
    <select ng-model="Filterkp" ng-options="item.username for item in users | filter:user.roles == 'kp'"> 
    </select> 
</div> 

내 필터를 선택 : -

<select ng-model="Filterkp" ng-options="item.username for item in users | filter:user.roles == 'kp'"> 

내 데이터 : -

$scope.users = [ 
    { 
    "_id": "5a12ab443cb3837415229d2e", 
    "displayName": "Avinaash Kumar", 
    "username": "John", 
    "created": "2017-11-20T10:15:32.747Z", 
    "roles": ["kp"], 
    "categories": [ 
     "Religion & Culture", 
     "Environment & and Health" 
    ], 
    "lastName": "Kumar", 
    "firstName": "Avinaash" 
    }, 
    { 
    "_id": "5a12a7343cb3837415229d2d", 
    "displayName": "sarawana kumar", 
    "provider": "local", 
    "username": "Henry", 
    "roles": ["school_student"], 
    "categories": [ 
     "Religion & Culture", 
     "Moral Ethics" 
    ], 
    "lastName": "kumar", 
    "firstName": "sarawana" 
    }, 
    { 
    "_id": "59ed8a1fd80e55a8100d51f0", 
    "displayName": "selvam mani", 
    "provider": "local", 
    "username": "Francis", 
    "roles": ["kp"], 
    "categories": [ 
     "Religion & Culture", 
     "Moral Ethics" 
    ], 
    "lastName": "mani", 
    "firstName": "selvam" 
    }, 
    { 
    "_id": "59ed87cdd80e55a8100d51ef", 
    "displayName": "jennifer david", 
    "provider": "local", 
    "username": "jennifer david", 
    "roles": ["block"], 
    "categories": [ 
     "Moral Ethics" 
    ], 
    "lastName": "david", 
    "firstName": "jennifer" 
    }, 
    { 
    "_id": "59e09811a7319ae81feed177", 
    "displayName": "ahamed nizar", 
    "provider": "local", 
    "username": "ahamednizar", 
    "created": "2017-10-13T10:40:17.142Z", 
    "roles": ["change_agent"], 
    "categories": [ 
     "Religion & Culture" 
    ], 
    "lastName": "nizar", 
    "firstName": "ahamed" 
    }, 
    { 
    "_id": "59df6a76b6748bc809050697", 
    "displayName": "Maniselvam selvam", 
    "provider": "local", 
    "username": "David", 
    "roles": ["admin"], 
    "categories": [ 
     "Religion & Culture", 
     "Moral Ethics" 
    ], 
    "lastName": "selvam", 
    "firstName": "Maniselvam" 
    } 

Answer 1

다음과 같이 필터 컨트롤러에 메서드를 추가합니다

$scope.flterWithKp = function(item){ 
    console.log(item); 
    return item.roles.indexOf('kp') >= 0; 
} 

을 그리고 당신이 그것을 사용하는 템플릿에이 같은

<div> 
    <p>3. How to filter roles of KP username in this dropdown</p> 
    <lable>I tried filter like :- <b>| filter:user.roles == 'kp'</b></lable> 
    <select ng-model="Filterkp" ng-options="item.username for item in users | filter:flterWithKp"> 
    </select> 
</div> 

Answer 2

변경하여 NG-옵션 코드. 답변에 대한

<select ng-model="Filterkp" ng-options="item.username for item in users | filter:{roles: 'kp'}"> 
    </select>