Working with select using AngularJS's ng-options

前端 未结 8 886
渐次进展
渐次进展 2020-11-22 08:30

I have read about it in other posts, but I couldn\'t figure it out.

I have an array,

$scope.items = [
   {ID: \'000001\', Title: \'Chicago\'},
   {ID         


        
8条回答
  •  旧巷少年郎
    2020-11-22 09:00

    The question is already answered (BTW, really good and comprehensive answer provided by Ben), but I would like to add another element for completeness, which may be also very handy.

    In the example suggested by Ben:

    
    

    the following ngOptions form has been used: select as label for value in array.

    Label is an expression, which result will be the label for element. In that case you can perform certain string concatenations, in order to have more complex option labels.

    Examples:

    • ng-options="item.ID as item.Title + ' - ' + item.ID for item in items" gives you labels like Title - ID
    • ng-options="item.ID as item.Title + ' (' + item.Title.length + ')' for item in items" gives you labels like Title (X), where X is length of Title string.

    You can also use filters, for example,

    • ng-options="item.ID as item.Title + ' (' + (item.Title | uppercase) + ')' for item in items" gives you labels like Title (TITLE), where Title value of Title property and TITLE is the same value but converted to uppercase characters.
    • ng-options="item.ID as item.Title + ' (' + (item.SomeDate | date) + ')' for item in items" gives you labels like Title (27 Sep 2015), if your model has a property SomeDate

提交回复
热议问题