angularjs ng-optionsでドロップダウンリストが作成されない

Question

私は隔離されたスコープを持つディレクティブを作成しました。何らかの理由でng-repeatの中でスコープ以外のスコープの値にアクセスできませんng-repeatで。ここでは、ng-optionsディレクティブで隔離されたscopeプロパティauthorityListにアクセスしたいのですが、ドロップダウンに値が設定されていません。

(function() { 

var app = angular.module('garageManagement'); 

app.directive('userManagement', function() { 
    return { 
     restrict: 'E', 
     templateUrl: 'app/directives/userManagementWidget/userManagementTemplate.html', 
     scope: { 
      users: "=", 
      authorityList: "=", 
      acceptUser: "&", 
      rejectUser: "&", 
      selectecAuthroity:"=", 
     } 
    }; 
}); 

}()); 

テンプレート

<div class="form"> 
<div class="col-12" ng-repeat="user in users "> 
    <div id="{{user.Id}}" class="row"> 
     <label for="example-text-input" class="col-3 col-form-label">{{user.UserName}}</label> 
     <div class="col-3"> 
    // issue here, authorityList returning undefined 
      <select class="form-control" ng-options="item in authorityList" ng-change="storeSelectionUserType(user.Id)" ng-model="user.StaffType"></select> 
     </div> 
     <div ng-hide="user.IsApproved" class="col-3"> 
      <button type="button" ng-click="acceptUser(user.Id)" class="btn btn-primary col-3">Accept</button> 
     </div> 
     <div ng-hide="user.IsApproved" class="col-3"> 
      <button type="button" ng-click="rejectUser(user.Id)" class="btn btn-primary col-3">Reject</button> 
     </div> 
    </div> 
</div> 

使用

<user-management users="users" authorityList="authorityList" acceptUser="acceptUser" rejectUser="rejectUser" storeSelectionUserType="storeSelectionUserType" selectecAuthroity="selectecAuthroity"></user-management> 

Answer 1

例は以下を参照してください。

<select name="repeatSelect" id="repeatSelect" ng-model="data.model"> 
     <option ng-repeat="option in data.availableOptions" value="{{option.id}}">{{option.name}}</option> 
</select> 

angular.module('ngrepeatSelect', []) 
.controller('ExampleController', ['$scope', function($scope) { 
    $scope.data = { 
    model: null, 
    availableOptions: [ 
     {id: '1', name: 'Option A'}, 
     {id: '2', name: 'Option B'}, 
     {id: '3', name: 'Option C'} 
    ] 
    }; 
}]); 

Answer 2

ng-optionsにキーと値を割り当てる必要があります。このように変更する

<select class="form-control" ng-options="item.id as item.name for item in authorityList" ng-change="storeSelectionUserType(user.Id)" ng-model="user.StaffType"></select>