我正在創建一個與輸入文本相關的事件發射器：
<input
type="text"
id="foo"
[formControl]="control"
autocomplete="off"
/>
和：
@Output()
textChange = new EventEmitter<string>();
public readonly control = new FormControl({value:'', disabled: this.disabled}, Validators.required);
初始化如下：
ngOnInit(): void {
this.control.valueChanges
.pipe(
filter(text => {
return text.length == 0 || text.length >= 2;
}),
debounceTime(300),
distinctUntilChanged()
)
.subscribe(text => this.textChange.emit(text));
}
奇怪的是，如果文本被填充，我得到：
textChange: "foooo"
但是，如果為空，我會得到：
textChange: {name: "textChange", args: ""}
而我只期望“”。
這是為什么？
uj5u.com熱心網友回復：
據我所知，系結到本地內容不是最佳實踐。使用反應形式。檢查這個例子
- https://stackblitz.com/edit/angular-ivy-g7j7vc?file=src/app/hello.component.ts
- https://stackblitz.com/edit/angular-ivy-g7j7vc?file=src/app/app.component.ts
- https://stackblitz.com/edit/angular-ivy-g7j7vc?file=src/app/app.component.html
uj5u.com熱心網友回復：
最好按照另一個答案中的建議使用反應式形式。在這種情況下，您將更好地控制正在發生的事情（測驗也更容易）。在那里你可以為你的輸入組件指定初始化值，你可以添加自定義同步/異步驗證器等等......
在你的情況下：
如果你改變：
inputChanged(event:any) {
this.valueChanged.next(this.value);
}
對此：
inputChanged(event:any) {
this.valueChanged.next(event.target.value);
}
它應該作業。
轉載請註明出處，本文鏈接：https://www.uj5u.com/gongcheng/352519.html
上一篇：帶有路由到組件的角度材料步進器