2014-09-30 46 views
1

我想知道如果我可以在一個Select元素的角度ng-options屬性中包含額外的邏輯。如何使用角度在Select元素中實現條件分組?

在一種情況下,我有一組平面的選項​​,並且沒有與它們關聯的分組。 另一方面,我有多個選項可能具有相同的描述,但是它們的ID因各自的分類而變化。根據發送的數據,我想將它們顯示爲分組或不分組。

分組:

<select ng-model="tcCtrl.SelectedItem" 
     ng-options="item.Id + ' - ' + item.Description 
        group by item.GroupDescription 
        for item in ctrl.Context.ItemList }"></select> 

不進行分組:

<select ng-model="tcCtrl.SelectedItem" 
     ng-options="item.Id + ' - ' + item.Description 
        for item in ctrl.Context.ItemList }"></select> 

有條件GROUPED?

如果可能的話,我想避免有select元素的兩個單獨的實例,但我不認爲ngSelectDirective的解析器真的採用任何條件邏輯。

有好的方法來實現這樣的想法?

更新: 以下是建議的嘗試的外觀......即使沒有任何'邏輯'來構建字符串。

var optionStr = "item.Id for item in ctrl.Context.Items"; 
...<select ng-options="{{ ctrl.optionStr }}"></select>... 

問題是當我嘗試綁定它的綁定似乎並不想堅持。如果我採用相同的生成字符串並替換{{property}},那麼它工作正常。我甚至可以用chrome確認這個字符串正在被加標。

更新: 我已經證明,建議的方法可以在非常無菌的環境中工作。 http://jsfiddle.net/xbws8r5h/

在我的環境中必須有一些變體。

+0

你爲什麼要編寫'ctrl.optionStr'。如果應該只是'optionStr'。您可以在ng-controller中定義控制器對象,例如'