angular - Angular Material 占位符不适用于 @Input

Question

我正在使用角度材料。在我的父组件中

<app-multiselect 
    [optionsList]="propertyTypeList"
    [multiple]=true
    [placeholder]="Select"
    ></app-multiselect>

在 .ts 文件的子组件中，我使用的是 @Input

@Input() placeholder: string;

在我的子 html 文件中

<mat-form-field>
  <mat-select 
  [multiple]="multiple"
  [placeholder]="placeholder">
    <mat-option 
    *ngFor="let item of optionsList" 
    [value]="item">{{item}}</mat-option>
  </mat-select>
</mat-form-field>

我得到的是“占位符”而不是“选择”。

有任何想法吗？谢谢 ：）

标签： angularangular-materialangular-material2

Answer 1

由于您将字符串作为输入传递，因此需要将其包含在''

<app-multiselect [placeholder]="'Select'" ></app-multiselect>

当你绑定时，你应该使用字符串插值作为{{}}

 <mat-select placeholder="{{placeholder}}">

STACKBLITZ DEMO