角度/ 2：角度2 - 観測値からの選択を選択してください

Question

私はhttps://www.npmjs.com/package/angular2-selectパッケージを使用しています。私は次のように移入され、「tagOptions」の値を選択したタグを移入しようとしている：

私が観測に加入し、次のようにサブスクライブ中に返されたデータをフォーマットしています：

/** 
* Load all available tags 
*/ 
private getTags() : void { 

    // The observable 
    this.tagService.tags$ 
    .subscribe((tags) => { 

     for (var i = 0; i < tags.length; i++) { 

      this.tagOptions.push({ value: tags[i].id, label: tags[i].name }); 
     } 

     this.variantForm.patchValue({ 
      tags: this.tagOptions 
     });    
    }); 

    let criteria = {columns: ['id','name']}; 
    // Make an ajax request and populate the observable 
    this.tagService.load(this.utilityService.encode(criteria)) 
    .subscribe(); 
} 

「core.umd.jsと私のテンプレートが

<ng-select 
    [options]="tagOptions" 
    placeholder="Select one" 
    multiple="true" 
    allowClear="true" 
    formControlName="tags"> 
</ng-select> 

ページのロードに出て私のテンプレート爆弾として読み込む：3462例外：未定義の 『選択』プロパティを設定できません"

私はselectにデータを入力する方法が間違っていると思われます。アドバイスをいただければ幸いです。

Answer 1

<ng-select>は、レンダリング後の[options]入力の変更を反映していないようです。これを回避するには、<ng-select>がレンダリングされる前にデータを準備する必要があります。角度経路ガード 'resolve'はまさにこれを行います。サブスクリプションでresolve関数を待機させると、データが使用可能になるまでページはレンダリングされません。

Router resolve guideへのリンク。

ハッピーコーディング:)