Question

我有登录页面，我使用手机号码和OTP登录。最初我输入手机号码并点击发送OTP并拨打服务，将OTP发送到注册的手机号码。然后我进入OTP，那时我隐藏了发送OTP按钮并启用了登录按钮。点击登录后，我需要将手机号码和otp传递给后端服务。但是我点击第二个按钮登录时，手机号码未定义。如何在Angular2中实现这一目标？

          <div>
            <input type="phone" id="mob" name="phone" #mob [(ngModel)]="loginIntData.mobile" class="form-control" onkeyup="validateNumber()" placeholder="Mobile" required="" />
          </div>

        <div>
            <input type="password" id="otp" name="otp" #otp [(ngModel)]="loginIntData.otp" class="form-control" onkeyup="otpValue()" placeholder="Emter OTP" required="" disabled/>
          </div>

        <div>
          <button class="sendbtn" id="otpbtn" class="btn btn-default submit" class="btn" onclick="sendOTP()" (click)="OnSendOTP(loginIntData)" >SEND OTP</button>
          <button id="loginbtn" class="btn btn-default submit" class="btn" routerLink="/landing" (click)="OnLogin(loginIntData)" >LOGIN</button>
        </div>


OnSendOTP(loginIntData : LoginInterface)
{
  this._httpService.OnOtp(loginIntData).subscribe (
       data => this.loginIntData = (data),
        error => alert("error"+error),
        () => console.log("received OTP")


  );
 }

OnLogin(loginIntData : LoginInterface) {
        console.log("Inside login method");
        console.log("mobile" +loginIntData.mobile);
        console.log("otp" +loginIntData.otp);
        this._httpService.Onvalidate(loginIntData).subscribe (
          // (res) => {console.log(res.json())}
             data => this.loginIntData = (data),
              error => alert("error"+error),
              () => console.log("user logged in", loginIntData)
        );
 }

Answer 1

您可以使用模板驱动表单首先导入formsModule

import { FormsModule } from '@angular/forms';

然后在您的组件或服务中创建一个变量

mobile: string;
otp: string;

然后你可以将它们绑定到输入

<input type="text" [(ngModel)]="mobile">
<input type="text" [(ngModel)]="otp">
<input type="submit" (click)="sendfunctionIncomponent()">



 sendfunctionIncomponent(){

    if (mobile&&otp){
    callServiceToSendData().subscribe(res=>{console.log(res)});
    }
}

在Angular2中传递数据

1 个答案: