如何使用名稱和值（數字ID）填充下拉列表？

Question

如何將下拉列表正確綁定到控制器變量，而是使用下拉列表數組的id屬性而不是使用值分配值，仍然使用數組的name屬性顯示下拉內容供最終用戶選擇？

AngularJS工作下拉模板，但沒有ID / Value屬性

<ui-select ng-model="ctrl.risk.owner" theme="select2" 
           ng-disabled="ctrl.disabled" style="max-width: 150px"
           title="Choose a person">
  <ui-select-match placeholder="Select/Search User">
    {{$select.selected.name}}
  </ui-select-match>
  <ui-select-choices repeat="user in ctrl.users | propsFilter: {name: $select.search}">
      <div value="user.id" ng-bind-html="user.name | highlight: $select.search"></div>
  </ui-select-choices>
</ui-select>

設置陣列（這是我在select-ui下拉庫中需要user.id的地方）

$http.get('api/users').then(function(response){
      if (response.data.Succeeded){     
              for (var key = 0; key < response.data.Result.length; key++){
                    user = response.data.Result[key];     
                    $scope.ctrl.users[user.id] = {name: user.name};
              }
              $scope.ctrl.userDone = true;
              return response.data.Result;
       }
       else{
             $scope.ctrl.msg += "<br />"+ 
             $sce.trustAsHtml(response.data);
       }
}); 

Answer 1

ui-select未使用值HTML屬性，因此它沒有意義。 您的選擇由您在重復聲明中指定的內容表示。

此語句意味着將使用該用戶進行綁定：

<ui-select-choices repeat="user in ctrl.users | propsFilter: {name: $select.search}">

該語句意味着用戶標識將用於綁定：

<ui-select-choices repeat="user.id as (id, user) in ctrl.users | propsFilter: {name: $select.search}">

通常，ng-model對象將獲得您指示的綁定內容。 我認為在ctrl.risk.owner獲取用戶沒有問題，但是您必須在代碼中期望它，然后可以根據需要獲取user.id。 我認為您正在嘗試訪問此行中的選定ID：

$scope.ctrl.users[user.id] = {name: user.name};

如果是這樣，您應該只查看所選用戶的ctrl.risk.owner 。

使用ui-select提供的示例。 我認為這與您最接近的嘗試相符： http : //plnkr.co/edit/?p=preview