如何在angular2中的同一控制器内的另一个函数中调用一个函数

Question

我正在登录页面上工作。我想要做的是在类validateLogin()和submit()中有两个功能。当点击登录按钮我已成功提交，我可以得到用户名和密码。

我想在我的提交函数中调用我的validateLogin函数，但我不能称之为我的崇高文本在validateLogin上显示错误，并且在我的chrome浏览器中没有收到任何错误。

import {Component} from '@angular/core'; 
import {NavController} from 'ionic-angular'; 
import {FormBuilder,Validators} from "@angular/common"; 

@Component({ 
    templateUrl: 'build/pages/home/home.html' 
}) 

export class HomePage { 

    public loginForm: any; 
    public commentOnTimeOut: any; 

    constructor(private navCtrl: NavController, public form:FormBuilder) { 
    this.loginForm = this.form.group({ 
     "email":["",Validators.required], 
     "password":["",Validators.required] 
    }) 
    } 

    validateLogin(cb){ 
    window.setTimeout(() => { 
     if (this.loginForm.value.email == 'admin' && this.loginForm.value.password == 'admin123') { 
      console.log("invoking If part"); 
      cb('valid User'); 
     } 
     else { 
      console.log("invoking elsePart"); 
      cb('Invalid User'); 
     } 
    }, 3000); 
    } 

    submit(){ 

    console.log(this.loginForm.value); 
    console.log(this.loginForm.value.email); 
    console.log(this.loginForm.value.password); 

    validateLogin(this.loginForm.value.email, this.loginForm.value.password, (response) => { 
     console.log(response); 
     this.commentOnTimeOut = response; 
    }) 

    this.commentOnTimeOut = "Validating User"; 
    console.log(this.commentOnTimeOut); 
    } 

} 

如何在我的提交函数中调用我的函数validateLogin？

下面是一个demo plunker它做工不错

错误：

GET http://localhost:8100/build/js/app.bundle.js in my console.

In my serve i get error like TypeScript error: /home/panini/AutoSparParts/app/pages/home/home.ts(40,5): Error TS2663: Cannot find name 'validateLogin'. Did you mean the instance member 'this.validateLogin'?

上面的错误我正在调用任何帮助

Answer 1

由于您正在使用实例的class，如果要引用该实例中的属性或方法，则必须在属性或方法名称前面添加this.。

In my serve i get error like TypeScript error: /home/panini/AutoSparParts/app/pages/home/home.ts(40,5): Error TS2663: Cannot find name 'validateLogin'. Did you mean the instance member 'this.validateLogin'?

这是因为如果this不添加到validateLogin方法，使用该名称的全局方法将被寻找，因为它不存在，则会引发错误。所以，你的submit方法应该是：

submit(){ 

    console.log(this.loginForm.value); 
    console.log(this.loginForm.value.email); 
    console.log(this.loginForm.value.password); 

    this.validateLogin(this.loginForm.value.email, this.loginForm.value.password, (response) => { 
     console.log(response); 
     this.commentOnTimeOut = response; 
    }) 

    this.commentOnTimeOut = "Validating User"; 
    console.log(this.commentOnTimeOut); 
    } 

---

UPDATE：

yes i try that this. and i get error like TypeScript error: /home/panini/AutoSparParts/app/pages/home/home.ts(40,5): Error TS2346: Supplied parameters do not match any signature of call target.

那是因为你的validateLogin方法期望只是一个单一的参数（cb参数）和你发送三个参数（电子邮件，密码和回拨）。

尝试通过修改一行：

// New method to handle the response 
processLoginResult(response) { 
    console.log(response); 
    this.commentOnTimeOut = response; 
} 

submit(){ 

    console.log(this.loginForm.value); 
    console.log(this.loginForm.value.email); 
    console.log(this.loginForm.value.password); 

    // Instead of calling it with email, password and the callback 
    // just send the added method as a callback 
    this.validateLogin(this.processLoginResult); 

    this.commentOnTimeOut = "Validating User"; 
    console.log(this.commentOnTimeOut); 
} 

Answer 2

要访问类的成员，你需要之前的任何使用this.班级成员，在你的情况下试试这个

this.validateLogin(this.loginForm.value.email, this.loginForm.value.password, (response) => { 
    console.log(response); 
    this.commentOnTimeOut = response; 
})