2017-06-20 23 views
0

私は角をつけて、タグ入力を使ってオートコンプリートしようとしました。オートコンプリートは正常に機能しますが、フォームを送信する前に、表示値と表示値のIDを定義します。 角2/4オートコンプリート定義値

私のJSONファイル:

[ 
      { 
       "active": true, 
       "code": "IDV", 
       "name": "Car destruct" 
      }, 
      { 
       "active": true, 
       "code": "VCV", 
       "name": "Vehicle road" 
      } 
] 

HTML:

<tag-input [(ngModel)]="folderCreate.sujet" name="sujet" 
         [theme]="'bootstrap'" [placeholder]="'Ajouter un type'" 
         [onTextChangeDebounce]="500" 
         [secondaryPlaceholder]="'Add un type'" 
         [onlyFromAutocomplete]="true"> 
          <tag-input-dropdown [autocompleteObservable]="**requestAutocompleteItemsSujet**"> 
           <ng-template let-item="item" let-index="index"> 
            {{item.display}} 
           </ng-template> 
          </tag-input-dropdown> 
        </tag-input> 

マイTSファイル:私は私のフォームを送信するとき

public requestAutocompleteItemsSujet = (text: string): Observable<Response> => { 
    return this.http 
     .get('../../../assets/data/type.json') 
     .map(data => data.json().map(item => item.name)); 
    } 

は、だから私は得る:

0: Object 
    display : Car destruct 
    value : Car destruct 

私は取得したい:

0: Object 
    display : Car destruct 
    value : IDV 

どのように私はこの問題を解決することができますか?

+0

plnkrの例を提供してください... – Nehal

+0

しかし、私はplnkrの仕組みを理解していません... – user1814879

+0

このリンクは、PlunkerのAngular2テンプレートを提供します。問題を再現するためのコードを追加して、plnkrを保存して、あなたの質問にそのリンクを共有することができます。 https://plnkr.co/edit/tpl:AvJOMERrnz94ekVua0u5 – Nehal

答えて

0

私はplunkrを実行していませんが、コードを見て、data.json()の後に2番目の.mapを削除してみてください。

+0

[OK]を、私は2番目のマップを削除したとき、私はオートコンプリートの項目を表示することはできません – user1814879

関連する問題