【问题标题】:Supplied parameters do not match any signature of call target - Typescript - header compoent提供的参数与调用目标的任何签名都不匹配 - Typescript - 标头组件
【发布时间】:2017-12-04 14:11:24
【问题描述】:

我正在发出 http 获取请求,但提供的参数与调用目标的任何签名都不匹配。我该如何纠正这个问题?

D:/xampp/htdocs/angular2/src/$$_gendir/app/header/header.component.ngfactory.ts (17017,35) 中的错误:提供的参数与调用目标的任何签名都不匹配。

D:/xampp/htdocs/angular2/src/$$_gendir/app/header/header.component.ngfactory.ts (17017,35) 中的错误:提供的参数与调用目标的任何签名都不匹配。

我的标题组件

import { Component, Renderer } from '@angular/core';
import { Title, DOCUMENT } from '@angular/platform-browser';
import { CountriesService } from '../services/countries.services';
import { Router, ActivatedRoute, Params } from '@angular/router';
import { AuthenticationService } from '../services/authentication.service';

import { FacebookService, InitParams, LoginResponse } from 'ngx-facebook';


@Component({
    moduleId: module.id,
    selector: 'app-header',
    templateUrl: 'header.component.html',
    styleUrls: ['../app.component.css'],
})
export class HeaderComponent {


    searchResultData: any = {};
    SearchParams: any = {};
    SearchResultChk: any = {};
    loginfailedmsg = false;
    registerfailedmsg = false;
    registersuccessmsg = false;
    pswdsuccessmsg = false;
    pswdfailedmsg = false;

    countrieslist: any = {};
    model: any = {};

    loading = false;
    returnUrl: string;
    responseData: any = {};
    loginStatus = 0;
    loginsuccessmsg = false;
    Forgotpasswordcont = false;
    LoginwithEmail = false;
    registerwithemail = false;

    public visible = false;
    public visibleAnimate = false;

    registerformcont = false;
    registerActive = true;
    loginactive = false;
    currentUser: any = {};
    PopupTitle = '';
    callBackfunc = '';
    responseNameCheck: any = {};
    LoginOptions: any = {};
    response: any = {};
    FacebookResponse: any = {};

    constructor(title: Title,
                private countriesService: CountriesService,
                private Router: Router,
                private authenticationService: AuthenticationService,
                private fb: FacebookService) {

        let initParams: InitParams = {
            appId: '************',
            cookie: true,
            xfbml: true,
            version: 'v2.8'
        };

        fb.init(initParams);

        Router.events.subscribe((val) => {
            this.searchResultCont = false;
            this.showStyle = false;
        });
    }

    fbloginAuth(FacebookResponseparam) {
        this.authenticationService.facebookloginregister(FacebookResponseparam)
            .subscribe(
                data => {
                    this.responseData = data;
                    this.loading = false;

                    if (this.responseData.status == 1) {

                        this.registersuccessmsg = true;
                        //  this.loginfailedmsg= false;
                        this.currentUser = JSON.parse(localStorage.getItem('currentUser'));
                        if (this.currentUser) {
                            this.loginStatus = this.currentUser.status;
                        }
                        setTimeout(() => this.visible = false, 2000);

                    } else {
                        this.registersuccessmsg = false;
                        this.registerfailedmsg = true;
                    }
                },
                error => {
                    this.loginfailedmsg = true;
                    this.loading = false;
                });
    }


    loginWithFacebook(): void {

        this.fb.login()
            .then((response: LoginResponse) => {
                this.response = response;
                console.log(response);

                this.fb.api('/me?fields=first_name, last_name, picture, email', 'get', {'accesstoken': this.response.accessToken})
                    .then(res => {

                        if (res.id) {
                            this.FacebookResponse = res;
                            this.fbloginAuth(this.FacebookResponse);

                        } else {
                            this.registersuccessmsg = false;
                            this.registerfailedmsg = true;
                        }
                    })
                    .catch(e => console.log(e));

            })
            .catch((error: any) => console.error(error));

    }


    ngOnInit() {

        this.currentUser = JSON.parse(localStorage.getItem('currentUser'));
        if (this.currentUser) {
            this.loginStatus = this.currentUser.status;
        }
    }


    forgotpassword() {
        this.loading = true;
        this.authenticationService.forgotpassword(this.model.emailid)
            .subscribe(
                data => {

                    this.responseData = data;
                    this.loading = false;
                    this.pswdsuccessmsg = false;
                    this.pswdfailedmsg = false;

                    if (this.responseData.status) {
                        this.pswdsuccessmsg = true;
                        this.PopupTitle = 'Email sent';
                        this.Forgotpasswordcont = true;
                        this.callBackfunc = '';

                    } else {
                        this.pswdfailedmsg = true;
                    }
                },
                error => {
                    this.loginfailedmsg = true;
                    this.loading = false;
                });
    }

    login() {

        this.loading = true;
        this.authenticationService.login(this.model.username, this.model.lpassword)
            .subscribe(
                data => {

                    this.responseData = data;
                    this.loading = false;

                    if (this.responseData.status) {

                        this.loginsuccessmsg = true;
                        this.loginfailedmsg = false;
                        this.currentUser = JSON.parse(localStorage.getItem('currentUser'));
                        if (this.currentUser) {
                            this.loginStatus = this.currentUser.status;
                        }
                        setTimeout(() => this.visible = false, 2000);

                    } else {
                        this.loginsuccessmsg = false;
                        this.loginfailedmsg = true;
                    }
                },
                error => {
                    this.loginfailedmsg = true;
                    this.loading = false;
                });
    }

    logout() {
        if (confirm('Are you sure you want to logout?')) {
            this.loginStatus = 0;
            localStorage.removeItem('currentUser');
        }
    }


    register() {

        this.loading = true;

        this.authenticationService.usernamecheck(this.model.username)
            .subscribe(
                data => {
                    this.responseNameCheck = data;
                    // console.log(this.responseNameCheck);
                });
        if (this.responseNameCheck.status == 0) {
            this.registerwithemail = true;
            this.callBackfunc = 'registerwithemail';
            this.loading = false;
            return false;
        } else {
            this.authenticationService.register(this.model)
                .subscribe(
                    data => {
                        this.responseData = data;
                        this.loading = false;

                        if (this.responseData.status) {
                            this.model = '';
                            this.registerfailedmsg = false;
                            this.registersuccessmsg = true;
                            // setTimeout(() => this.visible = false, 2000);
                            this.showmodel('loginwithemail');

                        } else {
                            this.callBackfunc = 'registerwithemail';
                            // this.stepone= true;
                            this.registersuccessmsg = false;
                            this.registerfailedmsg = true;
                        }

                    },
                    error => {
                        this.loginfailedmsg = true;
                        this.loading = false;
                    });
        }
    }
}

authentication.service.ts

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


@Injectable()
export class AuthenticationService {
    constructor(private http: Http) { }

    private LoginUrl = environment.ApiEndPointLoginURL;
    private RegisterURL = environment.ApiEndPointRegisterURL;
    private ForgotPswdURL = environment.ApiEndPointForgotPswdURL;
    private UsernameCheckURL = environment.ApiEndPointUsernameChkURL;
    private FacebookURL = environment.ApiEndPointFacebookURL;

    
    forgotpassword(email: any):Observable<Response>{
        let headers = new Headers();
        headers.append('Content-Type', 'application/x-www-form-urlencoded');
        headers.append('Access-Control-Allow-Methods', 'GET,PUT,POST,OPTIONS');
        headers.append('Access-Control-Allow-Origin', '*');
        
        //let params =    "emailid="+email;
        let params = {
            emailid: email
            }

        return this.http.post(this.ForgotPswdURL, params,{headers: headers})
                .map((response: Response) => { 
                    let user = response.json();     
                    return user;
                });
    }
    

    usernamecheck(username: any):Observable<Response>{
        let headers = new Headers();
        headers.append('Content-Type', 'application/x-www-form-urlencoded');
        headers.append('Access-Control-Allow-Methods', 'GET,PUT,POST,OPTIONS');
        headers.append('Access-Control-Allow-Origin', '*');
        
    // let params =    "username="+username;
        let params = {
            username: username
        }
        
        return this.http.post(this.UsernameCheckURL, params,{headers: headers})
                .map((response: Response) => { 
                    let user = response.json();     
                    return user;
                });
    }

    facebookloginregister(userDetails: any){
        let headers = new Headers();
        headers.append('Content-Type', 'application/x-www-form-urlencoded');
        headers.append('Access-Control-Allow-Methods', 'GET,PUT,POST,OPTIONS');
        headers.append('Access-Control-Allow-Origin', '*');
        
    /* let params =    "name="+userDetails.first_name+" "+userDetails.last_name+"&email="+userDetails.email+
        "&imgurl="+userDetails.picture.data.url+"&fb_id="+userDetails.id;*/
        
        let params = {
            name: userDetails.first_name+" "+userDetails.last_name,
            email:userDetails.email,
            imgurl:userDetails.picture.data.url,
            fb_id:userDetails.id
        }

        return this.http.post(this.FacebookURL, params,{headers: headers})
                .map((response: Response) => { 
                    let user = response.json();     
            
                    if (user && user.status) {                    
                        localStorage.setItem('currentUser', JSON.stringify(user));
                        return user;
                    }else{
                        return user;
                    }

                });
    }




    login(username: any, password: any) {
    let headers = new Headers();
    headers.append('Content-Type', 'application/x-www-form-urlencoded');
    headers.append('Access-Control-Allow-Methods', 'GET,PUT,POST,OPTIONS');
    headers.append('Access-Control-Allow-Origin', '*');
    
    // let params =    "email="+username+"&password="+password;
    let params = {
            email: username,
            password:password
        }

    //console.log(params);

    return this.http.post(this.LoginUrl, params,{headers: headers})
            .map((response: Response) => {   

                let user = response.json();     
            
                if (user && user.status) {                    
                    localStorage.setItem('currentUser', JSON.stringify(user));
                    return user;
                }else{
                    return user;
                }
            });
    }



    register(user: any){
    let headers = new Headers();
    headers.append('Content-Type', 'application/x-www-form-urlencoded');
    headers.append('Access-Control-Allow-Methods', 'GET,PUT,POST,OPTIONS');
    headers.append('Access-Control-Allow-Origin', '*');
    
    //let params =    "name="+ user.firstName+"&email="+ user.email+" &password="+user.password+"&country="+user.country;      

    let params = {
            name: user.firstName,
            email:user.email,
            password:user.password,
            country:user.country
        }
    return this.http.post(this.RegisterURL, params,{headers: headers})
            .map((response: Response) => {   
                let user = response.json();     
                return user;
            });
    }

}



    

【问题讨论】:

  • 请发布您的header.component.html
  • @yurzui,很长。文件
  • 模板中的函数调用与 ts 文件中的方法不匹配
  • 例如你在模板中写了(click)="forgotpassword()" 但是你在组件中的方法需要一个必需的参数email: any
  • @yurzui,将文件发送到您的邮箱

标签: angular http angular-services


【解决方案1】:

.post() 期望您发送 3 个参数:url, body, requestOptions

所以,正确的 cal 应该是:http.post(url, body, requestOptions)

话虽如此,你的params (body parameter) 是字符串而不是对象!

let params =    "emailid="+email;

把它改成一个对象:

let params = {
   emailid: email
}

检查你所有的params,他们都是string,需要Object

更新:

重复代码的最后一个功能。您有 2 个register 函数。还有 1 个额外的 }

AuthenticationService的末尾删除这个:

 register(user: any):Observable<Response> {
      let headers = new Headers();
      headers.append('Content-Type', 'application/x-www-form-urlencoded');
      headers.append('Access-Control-Allow-Methods', 'GET,PUT,POST,OPTIONS');
      headers.append('Access-Control-Allow-Origin', '*');

      let params =    "name="+ user.firstName+"&email="+ user.email+"&password="+user.password+"&country="+user.country;

      return this.http.post(this.RegisterURL, params,{headers: headers})
        .map((response: Response) => {
        let user = response.json();
        return user;
        });
    }

}

更新 2:

将你所有的调用转换成Observables,所以它会有一个返回类型。

例子:

facebookloginregister(userDetails: any): Observable<Response> { ... }

【讨论】:

  • 我更新了有问题的 authentication.service.ts 部分。
  • @vel 我更新了,我的回答,发现你有重复的代码。检查一下,看看它是否是你的麻烦的原因。
  • 对不起,我的原始源代码没有包含两个寄存器功能。
  • @vel 检查我的更新。我确信您需要将这些方法设为 Observables 才能获得返回类型。
  • 我解决了这个问题。我在header.component.html中调用没有参数的函数@
猜你喜欢
  • 2017-04-28
  • 1970-01-01
  • 2016-06-09
  • 2017-11-25
  • 2017-08-24
  • 2017-02-25
  • 2017-07-26
  • 2018-03-31
  • 2017-05-08
相关资源
最近更新 更多