2016-03-02 35 views
0

工作我有一個很簡單的「選擇」元素使用角模型綁定到值,如下所示:角度選擇模型不具有初始值

<select ng-model="data.value"> 
    <option ng-repeat="d in list" value="{{d.id}}">{{d.name}}</option> 
</select> 

運作良好的結合(I加2選擇元件結合到同樣的變種,當我改變其中一個第二個正確改變)。 我的問題是select元素在加載到變量的初始值時沒有正確設置。

我的控制器的代碼是:

app.controller('MainCtrl', function($scope) { 
    $scope.list = [{id:1,name:'aaa'}, 
       {id:2,name:'bbb'}, 
       {id:3,name:'ccc'}, 
       {id:4,name:'ddd'}, 
       {id:5,name:'eee'}]; 

    $scope.data = {value:2}; 
}); 

一個例子設定爲this plunker

任何幫助將不勝感激。

+1

使用$ scope.data = {值: '2'}; –

回答

0

初始化您的模型

$scope.data = {value:'2'} 

您可以更詳細地檢查here

0

我有一個爲你解決: -

可以使用NG-init初始化的第一個。 NG-模型可以從那裏照顧檢查以下Plunker爲制定把

<!DOCTYPE html> 
<html ng-app="plunker"> 

    <head> 
    <meta charset="utf-8" /> 
    <title>AngularJS Plunker</title> 
    <script>document.write('<base href="' + document.location + '" />');</script> 
    <link rel="stylesheet" href="style.css" /> 
    <script data-require="[email protected]" src="https://code.angularjs.org/1.4.9/angular.js" data-semver="1.4.9"></script> 
    <script src="app.js"></script> 
    </head> 

    <body ng-controller="MainCtrl"> 
    <p>Hello {{name}}!</p> 

    <!-- first select: 
    <select ng-model="data.value"> 
    <option ng-repeat="d in list" value="{{d.id}}">{{d.name}}</option> 
    </select> --> 

    <br/> 

    First Select :- 

    <select ng-init="data.value = list[0]" 
     ng-model="data.value" 
     ng-options="d.name for d in list"> 
    </select> 

    <br/> 
    second select: 
    <select ng-init="data.value = list[0]" 
     ng-model="data.value" 
     ng-options="d.name for d in list"> 
    </select> 
    <!--<select ng-model="data.value">--> 
    <!-- <option ng-repeat="d in list" value="{{d.id}}">{{d.name}}</option>--> 
    <!--</select>--> 

    <br/> 
    selected value: {{data.value}} 
    </body> 

</html> 

http://plnkr.co/edit/IydWDWosdLo6aSumb1ic?p=preview

注: - 我只是更新了它在 Plunker或只是上面的替換你的代碼!

0

我收到了你plunker與NG選項工作:

first select: 
<select ng-model="data.value" ng-options="d.id as d.name for d in list"> 
</select> 

<br/> 

second select: 
<select ng-model="data.value" ng-options="d.id as d.name for d in list"> 
</select>