0

*ngFor を使用して、ダイアログ コンポーネントに渡されたデータを表示しようとしています。私はこのようなデータを渡しています

const columnNames=['firstName', 'lastName','userName'];
    this.dialog.open(DatatableAdvancedSearchComponent,{
          width: '250px',
          data: {columnNames:columnNames}
    });

1.viewページを使用して、ダイアログコンポーネントでそれらにアクセスしようとしています

<div class="row">
 <select class="form-control">
 <option *ngFor="let column in columns" value="{{column}}">{{column}}</option>
 </select>
{{data.columnNames}}
{{columns}}
</div>

2.ts ページ

 columns=[];
  constructor(@Inject(MAT_DIALOG_DATA) public data: any) {
    
    this.columns=this.data.columnNames;
   }

出力を取得します

{{data.columnNames}}
{{columns}}

ただし、select ステートメントではありません。select にオプションが入力されていません。ご覧のとおり、同じ列が以下に入力されますが、select ステートメントではそうではありません。提案をお願いします。 ここに画像の説明を入力

4

2 に答える 2

0

「of」の代わりに「in」というキーワードを使用しているため、* ngForステートメントは正しくありません

これを使用=>

* ngFor="let column of columns"

于 2021-03-12T07:58:33.070 に答える