選擇元素上的角度ng-repeat選項會導致離開狀態時出錯

使用ng-repeat指令動態地爲angular.js中的<select>元素生成一些選項。選擇元素上的角度ng-repeat選項會導致離開狀態時出錯

進出口使用ng-repeat而不是ng-options，因爲這是一個空的形式，我想設置一個selected和disabled默認值，以及沒有在模型中最後一個選項。

var form = {}; // to be filled with form data, including form.boro 

var boros = {"BK":"brooklyn","Q":"queens","NY":"manhattan","BX":"bronx","SI":"staten island"} 

<select class='form-control capitalize' name="city" ng-model='form.boro' > 
    <option value="" >City</option> 
    <option ng-repeat="(k, val) in boros" value="{{k}}">{{val}}</option> 
    <option value='other'>Other</option> 
</select>

這產生預期的元素和選擇，但導致引發以下錯誤：

TypeError: Cannot read property '$$phase' of null

此錯誤結果從設置value=""在<option value="">City</option>

的應用程序仍然運行，並不會崩潰但我很好奇爲什麼會發生這種情況在國家退出，如果這些事情我做錯了。

來源

2017-01-09 yevg

看起來像放置selecteddisabled在空初始選項清除錯誤。

<option value="" selected disabled >City</option>

位由於我的疏忽：/

來源

2017-01-09 22:07:06 yevg

我認爲問題在於選項中的{{city}}，因此我沒有可用的模型。如果我們將{{boro}}作爲價值並且{{城市}}打印爲文本，我們需要在城市與Boro之間建立關係。或者你可以把所有城市放在一個對象數組中，並獲得城市的價值，並將boro鍵發送給控制器函數，並得到像{{getCity（boro）}}這樣的城市，並將boro設置爲ng-model =「boro 「

來源

2017-01-09 20:03:48

我很抱歉，但是這實際上是一個錯字 - 使用im上面貼的這個問題，它在我的應用程序不同的目的的實例中的代碼。我已經更新了它，並且仍然出現錯誤。如果'

'字段被刪除 – yevg

如果角度版本> 1.4，那麼嘗試如果角度版本<1.4 ng-show =「true」請檢查http://stackoverflow.com/questions/12654631/why-does-angularjs-include-an-empty-option-in-select –

我試着重現你的代碼示例，如果我理解的很好，問題實際上是你不把你的對象放在數組中，我相信ng-repeat在對象集合中執行。你可以把你的選項放在數組中，按照格式例如[{code：BQ，城市：布魯克林}]。下面請看

app.controller('MainCtrl', function($scope) { 
    $scope.form = {}; 
    $scope.boros = [ 
     {code: "BK", city: "brooklyn"}, 
     {code: "Q", city: "queens"}, 
     {code: "NY", city: "manhattan"}, 
     {code: "BX", city: "bronx"}, 
     {code: "SI", city:"staten island"} 
    ] 
});

而且你的模板：

<select class='form-control capitalize' name="city" ng-model='form.boro' > 
    <option value="" >City</option> 
    <option ng-repeat="boro in boros track by $index" value="{{boro}}">{{boro.city}}</option> 
    <option value='other'>Other</option> 
</select>

檢查this在plunker。

來源

2017-01-09 20:25:23 frodrigues

選擇元素上的角度ng-repeat選項會導致離開狀態時出錯

回答

相關問題