我试图在ng选择控件中显示占位符,但用户键入了一些内容,占位符不会隐藏。我用下面的代码克服了这个问题。
@Input() placeholder;
ngOnInit() {
this.searchInput$.pipe(
distinctUntilChanged(),
debounceTime(500)
).subscribe(term => {
term?.length > 0 ? this.placeholder = '' : this.placeholder = this.placeholder;
});
}
Html模板:
<ng-select [items]="items$ | async"
[multiple]="multiSelect" bindLabel="name"
[appendTo]="appendTo" [placeholder]="placeholder">
但当占位符是动态的时,此代码会将占位符重置为空字符串。
任何线索都将不胜感激。
以下是css如何显示和隐藏占位符
.ng-placeholder {
display: inline-block;
}
.ng-select-focused {
.ng-placeholder {
display: none;
}
}
.ng-has-value {
.ng-placeholder {
display: none;
}
}