Closed

Description
Bug, feature request, or proposal:
Bug
What is the expected behavior?
If you have a chips component roughly like the following (check stackblitz for a working example). The placeholder will not render as expected (hide on disabled true; show on disabled false) until you somehow trigger change detection by clicking the component.
<mat-form-field >
<mat-chip-list #chipList>
<mat-chip></mat-chip>
<input [placeholder]="getPlaceholder()">
</mat-chip-list>
</mat-form-field>
@Component({
selector: 'chips',
templateUrl: 'chips.html',
})
export class ChipsInputExample {
@Input() disabled: boolean;
getPlaceholder(): string {
return this.disabled ? '' : 'Has lime';
};
}
What is the current behavior?
Only shows placeholder (for disabled === false) after user triggers change detection.
What are the steps to reproduce?
https://stackblitz.com/edit/angular-hxrcpk
Other similar example:
https://stackblitz.com/edit/angular-hxrcpk-3zsauz
What is the use-case or motivation for changing an existing behavior?
Showing/hiding placeholder based on component's disabled input parameter.
Which versions of Angular, Material, OS, TypeScript, browsers are affected?
Angular: 6.0.5
Material 6.0.3
Is there anything else we should know?
This is not a new behaviour, it already happened in past material major versions.