2016-02-23 2 views
0

Я работаю над угловым применением 2, у меня есть ng2-select для выпадающего списка. Он работает отлично, когда я жестко программирую список опций. Но мое требование состоит в том, чтобы вытащить список из сервера, а затем перечислить в списке.Как установить параметр ng2-select, который исходит от ответа

export class EditProjectComponent { 
    routeParam: RouteParams; 
    aminities: any; 
    @ViewChild(Select) 
    private select: Select; 

    private items: Array<string> = ['']; 
    constructor(
     @Inject(Router) private router: Router, 
     @Inject(ProjectService) private projectService: ProjectService, 
     @Inject(DeveloperService) private developerService: DeveloperService, 
     @Inject(AmenityService) private amenityService: AmenityService, 
     routeParam: RouteParams, 
     private _formBuilder: FormBuilder 
    ) { 

     this.project = new ProjectModel(); 
     this.routeParam = routeParam; 
     this.getAmenities(); 
    } 

     private getAmenities() { 
     this.items.length = 0; 
     this.amenityService.get((res) => { 
      res.forEach(element => { 
       this.items.push(element.name); 
      }); 
     }, (err) => { }) 
    } 
} 

Html:

<ng-select [initData]="aminities" (data)="refreshValue($event)" [multiple]="true" [items]="items" [disabled]="disabled"></ng-select> 

Я получаю ошибку

Не удается прочитать свойство 'HasChildren' неопределенных в [инвалидов в EditProjectComponent @ 148: 114]

+0

Что позиция '@ 148: 114'? –

+0

Не знаю, мой EditProjectComponent просто имеет 116 строк, только после компиляции у него есть строка 135 – Rhushikesh

+0

Единственное различие между этим вопросом и этим: http://stackoverflow.com/questions/35551444/how-to-set-the-selected-value- of-the-ng2-select/35556107 # 35556107 заключается в том, что ваши товары должны поступать с сервера. правильно? или этот ответ не работал? –

ответ

0
private getAmenities() { 
     this.items.length = 0; 
     this.amenityService.get((res) => { 
      res.forEach(element => { 
       this.items.push(element.name); 
       this.select.itemObjects.push(new SelectItem({ id: element._id, text: element.name })); 
      }); 
     }, (err) => { }) 
    } 
0

Текущая версия документации объясняется лучше: ng2-select/valor-software.com

Вид сбоку (категория-edit.component.html):

<ng-select [multiple]="true" [items]="tags" [active]="active_tags"></ng-select> 

Независимо от того, если есть один или несколько элементов, всегда должен содержать формат массива, Ex .: [{ ID: 1, текст: MyText}] или [{ID: 1, текст: MyText1}, {ID: 2, текст: MyText2}]

компонентов сторона (категория-edit.component.ts) :

import {Component, OnInit, Injectable} from '@angular/core'; 

@Injectable() 
export class MyService { 

    getTagsByCategoryId(id: string): Observable<any> { /** callback */} 
} 

export interface SelectOption{ 
    id?: string; 
    text?: string; 
} 

@Component({ 
    selector: 'app-category-edit', 
    templateUrl: 'category-edit.component.html'  
}); 

export class CategoriesComponent extends OnInit{ 
    tags: SelectOption[]; /** Assumed you already loaded these */ 
    active_tags: SelectOption[];  

constructor(private myService:MyService){ 
    super(); 
} 
ngOnInit(){ 
    this.init(); 
} 

init(){ 

    const id= "the_id"; /** Some valid id to query */ 
    /** Callback */ 
    this.myService 
     .getTagsByCategoryId(id)(
      response=> { 
      if(response.error){ console.error(response.error);} 
      }else{ 
       console.log(response.result;) 
       this.active_tags= <SelectOption[]> response.result; 
      } 
      }, 
      error => {console.error(error);} 
    ); 
} 

}

Смежные вопросы