Angular在下拉菜單中不顯示選項的正確文本

有沒有其他人必須先支持Angular回到IE7？創建下拉列表時，我在8和7中都遇到了問題。Angular在下拉菜單中不顯示選項的正確文本

<select data-ng-model="relatedProduct.quantity" data-ng-init="setSelect(relatedProduct)"> 
    <option data-ng-repeat="i in getNumber(relatedProduct.maxQuantity) track by $index" value="{{ $index }}">{{ $index }}</option> 
</select>

忽略對select的ng-model和ng-init。 getNumber()是一個函數，它將從1返回給定的最大值，並因此返回將被渲染的最大選項數量。

我的問題是，當我打開下拉菜單時，每個選項的文本是{{ $index }}。選項的值屬性是正確的，因爲每當我選擇一個新選項時，都會顯示正確的值。只有當下拉打開時，問題纔會發生。

任何幫助表示感謝，謝謝！

來源

2014-10-02 ashrobbins

您是否嘗試過使用ngOptions？ – 2014-10-02 15:55:36

「當我打開下拉菜單時，每個選項的文本都是{{$ index}}。」 - 你還期望它是什麼？ – Blazemonger 2014-10-02 17:00:28

@Blazemonger我本來希望文本是代表數組中位置的數字。 1，2，3等。這適用於'value'屬性，但不適用於實際的元素文本。 – ashrobbins 2014-10-03 07:25:06

對於select S，你應該用ngOptions代替ngRepeat。 $index不ngOptions，所以你可以只使用i ...

<select data-ng-model="relatedProduct.quantity" 
    data-ng-options="i for i in getNumber(relatedProduct.maxQuantity)"></option> 
</select>

如果getNumber()收益從1到最大的數組，這將不太產生相同的結果作爲使用$index（$index爲0〜基於）。如果你需要的下拉菜單，從0開始，你可以做到這一點...

<select data-ng-model="relatedProduct.quantity" 
    data-ng-options="(i - 1) as (i - 1) for i in getNumber(relatedProduct.maxQuantity)"></option> 
</select>

這裏有一個live demo。不幸的是，我沒有IE 7的副本來測試，但它應該工作。

來源

2014-10-03 16:44:42

這真的很好。非常感謝，我一直在這裏拉我的頭髮。 @Anthony Chu – ashrobbins 2014-10-06 11:44:05

我對選擇標記和角度有很多問題。我發現的最佳解決方案是首先在控制器中創建選項數組，然後使用ng-options attr。

mainApp.controller('myCtrl', function ($scope) { 

    $scope.quantities = [ 
     {text : '0', value : 0}, 
     {text : '1', value : 1}, 
     {text : '2', value : 2}, 
    ]; 
    $scope.selectedQuantity = $scope.quantities[0]; 

}); 

<select ng-model="selectedQuantity" ng-options="item.text for item in quantities"></select>

來源

2014-10-02 19:12:41 Jase

Angular在下拉菜單中不顯示選項的正確文本

回答

相關問題