javascript - 如何解决错误类型错误:这是未定义的 [Angular]
问题描述
我正在使用 Angular 9 来解决这个问题。已经有一个问题(7 年前问过):
但这不是很有帮助。我检查了其他类似的问题:
我想在输入字段上的每次击键时调用一个方法。
HTML
<input ... type="text" (input)="crossCheckUsername()" placeholder="Enter username">
打字稿
constructor(..., private _userService: UserService) {
// nothing here
}
ngOnInit() {
// nothing here
}
// users is defined properly; it is hard coded in the starting only
isUserExists(): boolean {
let userExists = false;
this.users.forEach(function (user) {
if(*some logic*) {
userExists=true;
}
else {
userExists=false;
}
})
return userExists;
}
crossCheckUsername() { // this method will be called on every key stroke
if(this.isUserExists()) {
console.log("Try a different username");
}
else {
//do nothing; keep typing
}
}
但是我每次击键都会得到这个:
请纠正我的错误。
解决方案
工作解决方案:
HTML:
<input formControlName="username" type="email" class="form-control" id="usernameInput" (input)="crossCheckUsername($event.target.value)" placeholder="Enter username">
组件.ts:
crossCheckUsername(username: any) {
for (let i = 0; i < this.users.length; i++) {
if (this.users[i].email == username) {
console.log("already exists");
}
else {
console.log("ok keep typing");
}
}
}
推荐阅读
- ios - iTunes Connect - 未发送测试飞行邀请以进行内部测试
- php - 仅在 PHP 中将 switch 语句转换为一个
- python - discord py,尝试发送图像
- javascript - 如何将从 API 获取的数组分配给 Vue.js 中的数据属性?
- forms - 我的 HTML 表单是否正确发送到 Netlify lambda 函数?
- java - RecyclerView.setAdapter(androidx.recyclerview.widget.RecyclerView 适配器适配器
- kubernetes - 是否可以在 traefik 1.7 中设置具有速率限制的白名单
- android - 如何在我的 Android 应用程序中解决此 NullPointer 错误?
- python - 获取具有最大值的列,以说明熊猫中的关系
- xslt - 如何使用 XSL FO 在图像上对角书写文本