angular - 对象上确实存在属性目标
问题描述
ngAfterViewInit() {
const searchSource = document.getElementById("search-box");
const inputStream = fromEvent(searchSource, "input");
inputStream
.pipe(
map(event => (<HTMLInputElement>event.target).value.trim()),
debounceTime(500),
distinctUntilChanged(),
)
.subscribe(() => {
let updatedValue = encodeURI((searchSource as HTMLInputElement).value);
if (updatedValue.length >= 2) {
this.listSearchResults(updatedValue);
this.showProgressbar = true;
} else {
this.showDropDown = false;
this.noMatchesFound = false;
}
});
}
Angular 中的 TypeScript 在尝试访问上述代码中的事件目标时显示错误“对象上确实存在属性目标”。请问有什么想法吗?
解决方案
您应该将事件类型指定为KeyboardEvent
//MouseEvent
两者的联合,这将满足typescript
map((event: KeyboardEvent|MouseEvent) => (<HTMLInputElement>event.target).value.trim()),
相反,我建议您#templateVariable
在这种情况下使用 on 元素,并使用@ViewChild
装饰器来保留DOM
.
推荐阅读
- angular - 服务工作者获取新版本时显示加载屏幕
- sql - Vertica REFRESH_COLUMNS 失败并出现“Join inner did not fit in memory”错误
- javascript - 正则表达式仅获取 javascript 中的最后 N 个数字
- c# - 在 Linq 查询中返回空的可枚举作为属性会导致错误
- django - Django 项目中配置错误的自定义 HTTP 错误模板 (404,500)
- python - MongoDB与Python,用于存储游戏的用户名和密码
- jenkins - Jenkins用不同的参数一一运行作业
- mongodb - $lookup : 计算的foreinField 解决方法?
- java - 从 Callable 创建一个 HashMap 键
- spring - 将数据流映射到页面