简体   繁体   中英

AngularJs - Using ng-options in select

Im currently trying to display a list of category stored in an API in a select and I can't get my select to display it.

My list of category is stored in storageService.poi.categories (categories is an array with multiples objects inside who have 'label' as attribute and that's what im trying to display, ex: storageService.poi.categories[0].label will display 'TreeStart')

I've been searching for hours now and this should work (I think ?), but it doesn't

 <select ngModel="newPoi.categorie" name="categorie" class="categorie" ng-options="
cate.label for cate in storageService.poi.categories"></select>

Thank you for your help

EDIT : The data stored :

Object  /*<-- This is storageService.poi.categories*/
0:PoiCategory          /* This is what the objects inside categories looks like*/
  categories:Array[10]
  label:"TreeStart"
  landmarks:Array[0]
  popup:undefined
  symbol:undefined
  timestamp:undefined
  uid:0
  uid_parent:undefined
  __proto__:Object
67:PoiCategory
70:PoiCategory
71:PoiCategory
72:PoiCategory
73:PoiCategory
74:PoiCategory

If you doing this in Angularjs your ngModel should be ng-model

You could then do it like this

<select ng-model="newPoi.categorie" name="categorie" class="categorie" ng-options="
cate as cate.label for cate in storageService.poi.categories">

cate gets bind to the ng-model and the cate.label gets displayed in the option text.

For Angular2 it would look like

<select [ngModel]="newPoi.categorie" name="categorie" class="categorie">
  <option *ngFor="let cate in storageService.poi.categories" [ngValue]="cate">{{cate.label}}</option>
</select>

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM