2013-07-30 52 views
0

我試着用選中的每一行製作一個表格。從表選擇欄是從一個數組中的數據...AngularJS ng-selected ng-repeat多維

<div ng-app="app" ng-controller="MainCtrl"> 
<table> 
    <thead> 
     <tr> 
      <th>Headline #1</th> 
      <th>Headline #2</th> 
      <th>Headline #3</th> 
      <th>Headline #4</th> 
     </tr> 
    </thead> 
    <tbody> 
     <tr ng-repeat="user in users"> 
      <td>{{user.id}}</td> 
      <td>{{user.name}}</td> 
      <td> 
       <select name="" id=""> 
        <option value="" ng-repeat="role in roles">{{role.name}}</option> 
       </select> 
      </td> 
      <td>anything...</td> 
     </tr> 
    </tbody>  
</table> 

angular.module('app', []) 
.controller('MainCtrl', function ($scope) { 

     $scope.users = [ 
      { 
       id : 1, 
       name : 'Andrew', 
       role : "admin" 
      }, 
      { 
       id : 2, 
       name : 'Tanya', 
       role : "admin" 
      }, 
      { 
       id : 3, 
       name : 'Roland', 
       role : "author" 
      }, 
     ]; 

     $scope.roles = [ 
      { 
       name : "author" 
      }, 
      { 
       name : "admin" 
      } 

     ]; 



}); 

在這裏看到我的例子: jsFiddle

我需要的是簡單的,每個用戶都有一個角色,我希望每一行的正確角色被選中...

對不起,我的英語很不好...

THX彌敦道

回答

0

添加id字段中的角色數據列表這樣

$scope.roles = [{ 
    id: "author", 
    name: "author" 
}, { 
    id: "admin", 
    name: "admin" 
}]; 

,改變select元素

<select ng-model="user.role" ng-options="role.id as role.name for role in roles"></select> 

Demo on jsFiddle

+0

你不需要添加一個id字段。你可以使用'role.name'而不是新的'role.id'。見http://jsfiddle.net/MKb4N/ – dnc253

+0

@ dnc253好的。謝謝! – zsong