（XXX）不是函数angular 2 asp.net核心

Question

我得到一个eroor为this.loginservicemodel.loginHttpCall不是函数。我将角2结构分为三部分 - 1）组件2）查看模型和3）服务。

组件将与ViewModels和服务进行通信。服务可以访问viewModel。

我返回服务文件中的函数如下

loginservice.ts

import { Headers, RequestOptions } from '@angular/http'; 
import { Observable } from 'rxjs/Observable'; 
import { Injectable } from '@angular/core'; 
import { Http, Response } from '@angular/http'; 
import { LoginViewModel } from "../ViewModel/Login.ViewModel"; 
@Injectable() 
export class LoginService { 
    private heroesUrl = 'app/heroes'; // URL to web API 
    private loginModel = LoginViewModel; 
    constructor(private http: Http) { } 

    public loginHttpCall() { 
     console.log(this.loginModel); 
     let headers = new Headers({ 'Content-Type': 'application/json' }); 
     this.http.post('/contact/send', JSON.stringify(this.loginModel), { headers: headers }) 
      .subscribe(); 
} 

} 

Login.ViewModel.ts

export class LoginViewModel { 
    userName: string; 
    password: string; 
} 

login.Components.ts

import { Component} from '@angular/core'; 
import { LoginViewModel } from "../ViewModel/Login.ViewModel"; 
import { LoginService} from "../Service/Login.Service"; 
@Component({ 
    selector: 'login-app', 
    templateUrl: 'Home/partialLogin', 
    providers: [LoginViewModel, LoginService] 
}) 

export class LoginComponent { 
    private model = LoginViewModel; 
    private loginservicemodel: LoginService; 

    constructor() { 
     this.model.userName = '[email protected]'; 
     this.model.password = "test anand"; 

    } 

    login(event) { 
     this.loginservicemodel.loginHttpCall(); 
     event.preventDefault(); 

    } 

} 

登录（事件）函数被调用时，按一下按钮。

的方法调用this.loginservicemodel.loginHttpCall();功能，但我得到一个错误

TypeError: Cannot read property 'loginHttpCall' of undefined

Module.ts

import { NgModule } from '@angular/core'; 
import { BrowserModule } from '@angular/platform-browser'; 
import { FormsModule } from '@angular/forms'; 
import { Http } from '@angular/http'; 
import { LoginComponent } from "./Components/login.Component"; 


@NgModule({ 
    imports: [BrowserModule, FormsModule], 
    declarations: [LoginComponent], 
    bootstrap: [LoginComponent] 
}) 
export class AppModule { } 

我知道它没有得到方法，但我在哪里做的错误我不知道。

任何人都可以帮助我这个。

Answer 1

您需要在构造函数中注入依赖项。像这样：

constructor(private loginservicemodel: LoginService) { 
    this.model.userName = '[email protected]'; 
    this.model.password = "test anand"; 
}