爲什麼ng-model在AngularJs中沒有選擇價值？

Question

我有此陣列中的角：

$scope.skins = [ 
    { code : "default", name : "DEFAULT_TXT" }, 
    { code : "aero", name : "AERO_TXT" }, 
    { code : "navy", name : "NAVY_TXT" }, 
    { code : "facebook", name : "FACEBOOK_TXT" }, 
    { code : "turquoise", name : "TURQUOISE_TXT" }, 
    { code : "lime", name : "LIME_TXT" }, 
    { code : "green", name : "GREEN_TXT" }, 
    { code : "purple", name : "PURPLE_TXT" }, 
    { code : "white", name : "WHITE_TXT" }, 
    { code : "concrete", name : "CONCRETE_TXT" }, 
    { code : "watermelon", name : "WATERMELON_TXT" }, 
    { code : "lemonade", name : "LEMONADE_TXT" } 
] 

我已創建了NG-選項的選擇選項。我已經通過一些值設置了ng模型，但它沒有選擇它。我做錯了什麼？

下面是完整的例子JSFiddle

Answer 1

因爲你NG-模型結合對象在列表中，而不是「代碼」屬性，請改用此JavaScript代碼。

app = angular.module("myApp", []); 

app.controller('myCtrl', function ($scope, $http) { 
    var defSkin = { code: "white", name: "WHITE_TXT" }; 
    $scope.skins = [ 
     { code: "default", name: "DEFAULT_TXT" }, 
     { code: "aero", name: "AERO_TXT" }, 
     { code: "navy", name: "NAVY_TXT" }, 
     { code: "facebook", name: "FACEBOOK_TXT" }, 
     { code: "turquoise", name: "TURQUOISE_TXT" }, 
     { code: "lime", name: "LIME_TXT" }, 
     { code: "green", name: "GREEN_TXT" }, 
     { code: "purple", name: "PURPLE_TXT" }, 
     defSkin, 
     { code: "concrete", name: "CONCRETE_TXT" }, 
     { code: "watermelon", name: "WATERMELON_TXT" }, 
     { code: "lemonade", name: "LEMONADE_TXT" } 
    ] 

    $scope.opts = []; 
    $scope.opts.sidebarSkin = defSkin; 

}); 

Answer 2

它應該是這樣的

$scope.opts = {}; 

，並刪除track by ...

Demo

Answer 3

$ scope.opts是一個對象不是一個數組，

$scope.opts = {}; 

DEMO

Answer 4

可以使用納克選擇選擇特定值。 demo

<div ng-app="myApp"> 
     <div ng-controller="myCtrl"> 

     <select class="form-control" ng-model="opts.sidebarSkin" name="sidebarTemplate" ng-options="skin.code as skin.name for skin in skins" ng-selected="code == opts.sidebarSkin"> 

     </select> 
     </div> 
    </div> 

角JS代碼

app = angular.module("myApp", []); 

app.controller('myCtrl', function($scope, $http) { 

     $scope.skins = [ 
     { code : "default", name : "DEFAULT_TXT" }, 
     { code : "aero", name : "AERO_TXT" }, 
     { code : "navy", name : "NAVY_TXT" }, 
     { code : "facebook", name : "FACEBOOK_TXT" }, 
     { code : "turquoise", name : "TURQUOISE_TXT" }, 
     { code : "lime", name : "LIME_TXT" }, 
     { code : "green", name : "GREEN_TXT" }, 
     { code : "purple", name : "PURPLE_TXT" }, 
     { code : "white", name : "WHITE_TXT" }, 
     { code : "concrete", name : "CONCRETE_TXT" }, 
     { code : "watermelon", name : "WATERMELON_TXT" }, 
     { code : "lemonade", name : "LEMONADE_TXT" } 
     ] 

     $scope.opts = {}; 
     $scope.opts.sidebarSkin = "white"; 

    });