无法读取Ionic中的属性

时间:2018-07-02 16:55:55

标签: html angular ionic-framework login credentials

这是我的错误:

  

无法读取未定义TypeError的“用户名”属性

这是给我错误的HTML代码:

<ion-content  padding style="text-align: center; margin-top: 35px">
    <form (ngSubmit)="logForm()">
        <ion-list>

    <ion-item style="width: 80%; margin-left: 10%; margin-right: 10%">
      <ion-label fixed>Username</ion-label>
      <ion-input [(ngModel)]="cred.username" type="text" id="username"></ion-input>
    </ion-item>
  </ion-list>
        <ion-list>

    <ion-item style="width: 80%; margin-left: 10%; margin-right: 10%">
        <ion-label fixed>Password</ion-label>
      <ion-input [(ngModel)]="cred.password" type="password" id="password"></ion-input>
    </ion-item>
  </ion-list>
  <ion-list>

      <ion-item style="width: 80%; margin-left: 10%; margin-right: 10%">
          <ion-label fixed>Re-Type</ion-label>
        <ion-input [(ngModel)]="cred.passwordTwo" type="password" id="passwordTwo"></ion-input>
      </ion-item>
    </ion-list>

  <button style="width: 80%; height: 40px; margin-left: 10%; margin-right: 10%; margin-top: 10px"  (click) = "loginMain()" >Sign Up</button>
  <h5>Have An Account?</h5> <a style="color: blue;" (click) = "login()" > Log In! </a>
</form>
</ion-content>

当您单击“注册”按钮时,我试图让cred的值保存cred.username和cred.password。相反,我只是收到此错误。问题是什么?

EDIT :添加问号时(cred?.username):

Error: Template parse errors:
Parser Error: The '?.' operator cannot be used in the assignment at column 17 in [creds?.username=$event] 

1 个答案:

答案 0 :(得分:0)

多数民众赞成在没有定义元素。 您只需在组件的TS文件中定义带有用户名和密码字段的cred接口即可,例如:

interface cred {
    username?: string;
    password?: string;
}

然后您可以在HTML模板中使用它们