ng2-select2でAJAXを使用

Question

私のangular2jsプロジェクトには多くのドロップダウンがあります。これらのドロップダウンにはng2-select2を使用しています。いくつかのドロップダウンでは、select2検索ボックスに文字列のユーザータイプごとにAPIからデータをフィルタリングして取得する必要があります。プラグインはAJAXを初期化しますが、起動しません。

私のコード今のところ：

HTML：

<select2 [data]="options | async"></select2> 

コンポーネント：

import { Component,OnInit } from '@angular/core'; 
import {Select2OptionData} from 'ng2-select2'; 
import {AlertService, LTJService} from '../../_services/index'; 
import { Observable } from 'rxjs/Observable'; 

@Component({ 
    selector: 'nationalities', 
    templateUrl: '../../views/buyer_profile/nationalities.component.html', 
}) 

export class NationalityComponent implements OnInit { 
    //public nationalities: Observable<Array<Select2OptionData>>; 
    public options: Select2Options; 
    public ajaxOptions: Select2AjaxOptions; 


    constructor(private alertService: AlertService, private ltjService: LTJService) { 
    } 

    ngOnInit(): void { 
     console.log('In ngOnInit'); 

     this.ajaxOptions = { 
      url: '<API URL>', 
      dataType: 'json', 
      delay: 250, 
      cache: false, 
      data: (params: any) => { 
       console.log("AA", params); 
       return { 
        query: params.term, 
        gotoPage: params.page 
       } 
      }, 
      processResults: (data: any, params: any) => { 
       params.page = params.page || 1; 
       console.log('data: ', data); 
       return { 
        results: $.map(data.data, function(obj) { 
         return {id: obj.id, text: obj.name}; 
        }), 
        pagination: { 
         more: (params.page * 10) < data.objectValue.total_count 
        } 
       }; 
      }, 
     }; 

     this.options = { 
      ajax: this.ajaxOptions 
     } 
    } 
} 

誰もが正しい方向に私を指すことができますか？ 本当にありがとうございます。

Answer 1

あなたが入力したデータだけではないオプション

<select2 [data]="options | async"></select2> 

が

<select2 [options]="options | async"></select2>