AngularJS和Select2模型狀態不在選擇框後呈現

Question

我遇到了某種問題，如果我有一個範圍變量定義，它顯示在HTML到達select2框之前，但如果我在select2後顯示變量元素，它不呈現。

這裏是我的HTML：

{{stateIsValid}} 
<select id="state" name="state" class="select2" ng-change="stateChanged()" ng-model="client.state"> 
    <option value="state">State...</option> 
    <option value="NJ">NJ</option> 
</select> 
{{stateIsValid}} 

的JS只是建立了選擇2箱，並設置一個範圍變量：

$('.select2#state').select2(); 
angular.extend($scope, { 
    stateIsValid: false 
}); 

我的問題是，在HTML選擇，第一{{stateIsValid }}渲染「false」，但第二個渲染根本不顯示，只顯示{{stateIsValid}}。

我沒有得到任何控制檯錯誤。 這似乎是與select2渲染本身的具體錯誤。如果我註釋掉select2（）初始化，那麼一切正常。

我試圖讓這個工作，所以我可以在選擇框下面顯示自定義錯誤。

任何幫助，將不勝感激！

感謝， 瑞安

Answer 1

有東西在select2初始化方法怪異。 您可以用$timeout包裝解決。

$timeout(function() { 
    $('.select2#state').select2(); 
    }) 

這裏plunkr：http://plnkr.co/edit/i1HNAtfHfNkq2srAff5S?p=preview