無法將下拉選項設置爲默認選擇

Question

我試圖將下拉值設置爲來自JavaScript代碼的默認值，但我無法對其進行設置。

我的代碼jsFiddle

<div ng-controller="csrClrt"> 

    <div ng:repeat="(key, item) in items track by $index"> 

     <md-input-container> 
      <label>Face Style:</label> 
      <md-select ng-model="item.style" ng-change="f_style()" ng-model-options="{trackBy: '$value.id'}"> 
       <md-option ng-value="user" ng:repeat="user in styles">{{user.name}}</md-option> 
      </md-select> 
     </md-input-container> 
     <div> 
      Id:{{item.style.id}} 
      <br/> Want to Display Name {{item.style.name}} 
     </div> 
    </div> 


</div> 

JavaScript代碼

angular.module('MyApp', ['ngMaterial']) 
.controller('csrClrt', function ($scope) { 
    stylesdata = [{ 
      name: "a", 
      id: 0 
     }, { 
      name: "b", 
      id: 1 
     }, { 
      name: "c", 
      id: 3 
     } 
    ]; 
    $scope.items = ["0"]; 
    var style = []; 
    for (var i = 0; i < stylesdata.length; i++) { 
     style.push({ 
      name: stylesdata[i].name, 
      id: stylesdata[i].id 
     }) 
    } 
    $scope.styles = style; 
}) 

Answer 1

您還沒有創建items對象正確和沒有必要的ng:repeat="(key, item) in items track by $index"

查看

<div ng-controller="csrClrt"> 
    <md-input-container> 
     <label>Face Style:</label> 
     <md-select ng-model="items.style" ng-change="f_style()" ng-model-options="{trackBy: '$value.id'}"> 
      <md-option ng-value="user" ng:repeat="user in styles">{{user.name}}</md-option> 
     </md-select> 
    </md-input-container> 
    <div> 
     {{items.style}} 
    </div> 
</div> 

控制器

$scope.items = { 
    style: { 
     id: 1 
    } 
}; 

Updated Fiddle