TypeScript - איך אני מממש רשימת בחירה מלאה בנתונים עם Angular 6
אני חדש ב-Angular 6, או בעצם רק ב-Angular באופן כללי. אני רוצה לשים רשימת בחירה בעמוד שלי שתתמלא בערכים שאני מקבל מבקשת JSON במקום אחר. איך אני אקדם משימה זו?
תשובה #1
// http request with your server data.
options$ = this.yourHttpService.getOptions(API); // returns an Observable
נניח שהפורמט הוא JSON (נפעיל את option.value ב-HTML):
{
value: 'Option1',
otherValue: '....'
}
בקובץ ה-HTML שלך, מלא את האפשרויות עם async:
<select [(ngModel)]="yourOption" id="category">
<option value="" disabled selected>>select an option</option>
<option *ngFor="let option of options$ | async" [value]="option.value">{item.category}}</option>
</select>
תשובה #2
בהנחה שהנתונים שלך שצריך להכניס לרשימת הנפתחות הם בעצם מערך:
myData = {data: [v1, v2, v3, v4]};
בקובץ component.html שלך
<select>
<option *ngFor="let eachVal of myData['data']>
{{eachVal}}
</option>
</select>
אמור לעשות את הטריק.
מאז שאתה לא מספק את קוד הקטע שלך, יש לי דוגמת StackBlitz שמשתמשת בתגיות select ו-option עם Angular. תסתכל עליהן.
