为什么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"; 

    });