类型错误: 无法读取未定义的属性“用户名”
TypeError: Cannot read property 'username' of undefined?
我正在使用 Ionic 2 开发一个应用程序并得到以下错误。当我删除[(ngModel)]="register.username"错误消失时。
TypeError: Cannot read property 'username' of undefined in [register.username in RegisterPage@15:19]
<ion-navbar *navbar>
<ion-title>Register</ion-title>
</ion-navbar>
<ion-content class="login-page">
<ion-list>
<div class="logo">
<img src="img/appicon.svg">
</div>
<form #signupForm="ngForm" novalidate>
<ion-item>
<ion-label floating primary>Username</ion-label>
<ion-input [(ngModel)]="register.username" ngControl="username" type="text" #username="ngForm" required>
</ion-input>
</ion-item>
<p [hidden]="username.valid || submitted == false" danger padding-left>
Username is required
</p>
<ion-item>
<ion-label floating primary>Password</ion-label>
<ion-input [(ngModel)]="register.password" ngControl="password" type="password" #password="ngForm" required>
</ion-input>
</ion-item>
<p [hidden]="password.valid || submitted == false" danger padding-left>
Password is required
</p>
<div padding>
<button (click)="onSignup(signupForm)" type="submit" primary block>Create</button>
</div>
</form>
</ion-list>
</ion-content>
注册.js
import { App, Page, NavController } from 'ionic/ionic';
@Page({
templateUrl: 'build/pages/register/register.html'
})
export class RegisterPage {
constructor(nav: NavController) {
this.nav = nav;
}
onSignup(form) {
// console.log(form);
// if (form.valid) {
// this.nav.push();
// }
}
}
想知道我做错了什么?我应该阅读任何文档?(如果您想了解更多信息,请告诉我)
也许您的register
对象是异步加载的。为了防止这种情况,只需使用 Elvis 运算符:register?.username
或在表单周围使用ngIf
:
<form #signupForm="ngForm" novalidate *ngIf="register">
<ion-item>
<ion-label floating primary>Username</ion-label>
<ion-input [(ngModel)]="register.username"
ngControl="username" type="text"
#username="ngForm" required>
</ion-input>
</ion-item>
(...)
</form>
编辑
将register
对象设置为空对象应该解决您的问题:
import { App, Page, NavController } from 'ionic/ionic';
@Page({
templateUrl: 'build/pages/register/register.html'
})
export class RegisterPage {
constructor(nav: NavController) {
this.nav = nav;
this.register = {};
}
onSignup(form) {
// console.log(form);
// if (form.valid) {
// this.nav.push();
// }
}
}
希望对您有所帮助,蒂埃里
相关文章:
- MEAN.js MongoDB查询中用户特定计算的属性
- 如何使用用户界面选择组筛选器属性
- 反应.js组件:用户定义的属性.我做得对吗
- 如何通过客户端获取用户控件属性
- 角度 ui-select 绑定到一个属性,但向用户显示另一个属性
- 用户脚本 - 将变量的属性替换为函数
- 在向用户呈现数据之前删除 JSON 内容/删除 JavaScript 对象属性
- 跨用户控件属性设置和保留值
- 无法使用 javascript 在用户控件中获取 FileUpload 的属性“值”
- XPathResult 方法和属性不起作用 greasemonkey 用户脚本
- 使用用户脚本记录网页动态创建的标记属性
- 使用用户提供的对象的属性(如果存在),否则使用默认值
- 在javascript更新后,从web用户控件获取codebehind中的asp:TextBox文本属性
- Orionjs-博客示例-用户无法更新帖子中的任何属性
- TypeError:无法设置属性'用户'的未定义
- 当用户单击图像时传递图像名称或图像id属性
- 将用户提交的外部链接属性转换为在新窗口中打开
- 获取所有用户定义的窗口属性
- 基于当前用户属性发布流星集合
- 如何根据用户的输入循环遍历Json对象,然后使用对象属性