单击时,登录按钮无法正常工作。

时间:2018-07-31 15:40:22

标签: angular ionic3

嗨,我有一个代码,当我单击登录按钮时,此消息出现了。在这些代码中,我收到了类似的错误消息:当我按登录名时,我收到了我在此处提供的那种图像的错误消息。我找不到有什么问题请帮帮我。

         than you in advance

enter image description here

我的代码是这样的 account-service.ts

 import { Injectable } from '@angular/core';
 import { Http,Headers,RequestOptions,RequestMethod} from '@angular/http';
 import {Observable} from 'rxjs/Observable';
 import 'rxjs/add/operator/map';
 //import{Observable} from 'rxjs';

  @Injectable()
 export class AccountServiceProvider {
constructor(private http:Http) {
  }
 new(user,pass){
 var _url="http://localhost:14164/api/Login";
 var _body={"username":user,"password":pass};
 var _header=new Headers({'Content-Type':'Application/json'});
 var _option=new RequestOptions({method:RequestMethod.Post,headers:_header});
 return this.http.post(_url,_body,_option).map(res=>res.json());
  }

  }

我的home.ts

     import { Component,ViewChild} from '@angular/core';
            import { NavController,AlertController, IonicPage,LoadingController, 
           Loading,ToastController } from 'ionic-angular';
           import { MainpagePage } from '../mainpage/mainpage';
           import { RegPage } from '../reg/reg';
           import { AccountServiceProvider} from '../../providers/account- 
             service/account-service';
                import {Http} from '@angular/http';
            //import { HomePage } from '../home/home';
                      @Component({

  selector: 'page-home',
  templateUrl:'home.html'
//  providers:[AccountServiceProvider]
  // template: '<button ion-button full  [navPush]="newPgeGo" [navParams]="params">Login</button>'
})
export class HomePage {

  //registerCredentials = { email: '', password: ''};
  userName:String;
  password:String;

//  mainpage: MainpagePage;
//  reg: RegPage;
constructor(public navCtrl: NavController,
public acc:AccountServiceProvider,
public toastCtrl: ToastController
) {}

signin(){
  this.acc.new(this.userName,this.password).subscribe(data => {
    if(data==null){
      let toast=this.toastCtrl.create({
        message:'fail',
        duration:2000
      });
      toast.present();

    }else{

      let toast=this.toastCtrl.create({
        message:'sucess',
        duration:2000
      });
      toast.present();


    }
  });
}

public createAccount() {
    this.navCtrl.push(RegPage);
  }


}

和我的家.html

<ion-header>
  <ion-navbar>
    <ion-title>Login</ion-title>
  </ion-navbar>
</ion-header>

<ion-content padding>
   <form (ngSubmit)="login()" #registerForm="ngForm">
     <ion-row>
            <ion-col>
              <ion-list inset>

                <ion-item>
                  <ion-input type="text" placeholder="Email" name="email" [(ngModel)]="userName" required></ion-input>
                </ion-item>

                <ion-item>
                  <ion-input type="password" placeholder="Password" name="password" [(ngModel)]="password" required></ion-input>
                </ion-item>

              </ion-list>
            </ion-col>
          </ion-row>

          <ion-row>
            <button ion-button full (click)="signin()">Login</button>
          </ion-row>

        </form>

        <ion-row>
          <button ion-button class="register-btn" block clear (click)="createAccount()">Create New Account</button>
        </ion-row>
</ion-content>

1 个答案:

答案 0 :(得分:1)

您正在调用的login()方法似乎不存在

<form (ngSubmit)="login()" #registerForm="ngForm">