密码或用户名输入两次，当用角度输入时输入

Question

我正在与Angular进行简单的用户名和密码对话。我有一个模板：

<label class="welcome-content">Username:</label> 
<input #userName type="text" id="txtLoginUsername" (keyup.enter)="loginUser(userName.value)" 
                    (blur)="loginUser(userName); loginUser.value='' "> 
<label class="welcome-content">Password:</label> 
<input #userPass type="password" id="txtLoginPassword" (keyup.enter)="loginPass(userPass.value)" 
                    (blur)="loginPass(userPass); loginPass.value='' "> 
<button class="linkButton welcome-content" id="lnkLogin" (click)="loginUser(userName.value); loginPass(userPass.value)">Login</button> 

和控制器：

userName: string = null; 
userPass: string = null; 

loginUser(userName): void { 
    this.userName = userName; 
    console.log(this.userName); 
    } 

    loginPass(userPass): void { 
    this.userPass = userPass; 
    console.log(this.userPass); 
    } 

事工作的罚款，当我按一下按钮，但是当我按在用户现场我得到的用户名输出输入两次，和如果我在密码字段中输入密码，那么密码也是一样的。我如何制作这样的值只能输入一次？

Answer 1

的位置代码：

<input #userName type="text" id="txtLoginUsername" 
    (keyup.enter)="loginUser(userName.value)" 
    (blur)="loginUser(userName); loginUser.value='' "> 

在刚刚在所提供的代码看，我会假设你真的只需要登录时，他们点击登录按钮的用户。所以loginUser方法应该从两个输入框中移除。

<label class="welcome-content">Username:</label> 
<input #userName type="text" id="txtLoginUsername" > 
<label class="welcome-content">Password:</label> 
<input #userPass type="password" id="txtLoginPassword">