1. 程式人生 > >angular下拉框賦值問題

angular下拉框賦值問題

虛擬 mode name blog ole gpo 9.png lar ges

描述:在我們的項目中,會用到下拉框選項,比如後臺系統,會有新增修改刪除等操作;

當新增時,會輸入一些內容,也會利用到下拉框,保存之後數據發送給後臺;

當編輯時,需要把上次的內容帶到本次中,下拉框需要展示出新增保存時所選擇的那個,具體做法如下;

$scope.roleNameLIst= [

  {id:"sys009",name:"技術部管理員",age:18,address:"北京市昌平區"},

  {id:"sys008",name:"物業管理員",age:20,address:"北京市昌平區"},

  {id:"5c343c65d6544116bb8b7e1ca9fbf483",name:"test23",age:25,address:"北京市昌平區"},

];//虛擬數據

例如上次新增保存時,select選擇的是id為2的那條數據{id:2,name:"ls",age:20,address:"北京市昌平區"},,此時編輯也是編輯這一條數據時

<select ng-init="type=null" ng-model="type" ng-options="m.id as m.name for m in roleNameLIst" ></select>

此時在dom結構裏看到的數據為下圖option的value為字符串的時候:

技術分享圖片

獲取到值的時候,如果要顯示第二條就綁定:$scope.type = $scope.roleNameLIst[1].id(或者是獲取到的id,這裏沒有獲取操作,所以直接進行的綁定)即可;

當option的value的值為數字number時:

技術分享圖片

獲取到值的時候,如果要顯示第二條就綁定:$scope.type = Number($scope.roleNameLIst[1].id)(當id為數字時,需要進行一下轉換,確保與option的value格式相同,如果不同則顯示不出想要的數據)即可;

angular下拉框賦值問題