Question

这是我的代码我收到错误消息＆＃39;输入用户名＆＃39;并输入密码＆＃39;关于单输入字段触摸。我认为#name和ngModel有问题。我无法弄清楚。

的login.html

    <div class="form-group">
      <input  type="text" class="form-control" id="usr" placeholder="username" [(ngModel)]="username" name="username"  #name="ngModel" maxlength="10" minlength="5" required>
    </div>
    <div [hidden]="name.valid || !(name.dirty || name.touched)">
           <div class="text-danger">Please enter name</div>
    </div>
    <div class="form-group">
      <input type="password" class="form-control" id="pwd" placeholder="password" [(ngModel)]="password" name="password" #name="ngModel"  maxlength="10" minlength="5" required>
    </div>
    <div [hidden]="name.valid || !(name.dirty || name.touched)">
           <div class="text-danger">Please enter Password</div>
    </div>

login.ts

export class loginComponent {
constructor(){}
username :any;
buttonName:string;
    password:any;
    itemShow:boolean=false;
    loginClick:boolean = false;
    forgotPassClick:boolean = false;
    RegisterClick :boolean = false;`enter code here`
    loginSwitch:string;

Answer 1

对于您使用的SomeOperationB输入字段true，该字段应为Promise<Wrapped<string>>

SomeOperationB

Answer 2

你可以复制＆amp;通过您的姓名密码输入代码，您需要在#name

中重命名模板引用名称#name="ngModel"

Tempalte引用名称（让我们将其命名为#mypassword）不能与password中的变量[(ngModel)]="password"相同;然后将隐藏的警报模板引用名称修改为mypassword

<div class="form-group">
  <input
    type="password"
    class="form-control"
    id="pwd"
    placeholder="password"
    name="password"
    [(ngModel)]="password"
    #mypassword="ngModel"
    maxlength="10"
    minlength="5"
    required>
</div>
<div [hidden]="mypassword.valid || !(mypassword.dirty || mypassword.touched)">
  <div class="text-danger">Please enter Password</div>
</div>

或者，如果您将user对象传递给html，如下所示，它可以正常工作，没有错误：

[(ngModel)]="user.password"
#password="ngModel"

如何验证单独的用户名和密码？

2 个答案: