将服务层内的功能绑定到模板

时间:2016-10-19 03:11:59

标签: angular typescript

我正在尝试从登录页面组件中分离出与服务相关的功能,我目前在self.context.logout is not a function的行中遇到了一些错误。下面,我试图将loginService注入loginPage,然后将服务中的一些函数绑定到我的登录模板。有什么想法我收到这些错误?提前谢谢!

login服务

import { Injectable } from '@angular/core';

@Injectable()
export class LoginService {
    constructor() {
        console.log('constructor logic');
    }

    checkLoginStatus() {
        console.log('login logic');
    }

    logout() {
        console.log('logout logic');
    }
}

LoginComponent

import { Component } from '@angular/core';

@Component({
  selector: 'page-login',
  templateUrl: 'login.html',
  providers: [LoginService]
})
export class LoginPage {

  constructor(loginService : LoginService) {

  }

}

模板文件

<button class="login-button" on-tap="loginService.checkLoginStatus()">
  Log In 
</button>
<button class="login-button" on-tap="loginService.logout()">
  Log Out 
</button>

1 个答案:

答案 0 :(得分:2)

您需要在构造函数中为服务提供访问修饰符,否则它只限于构造函数

// constructor(loginService : LoginService)
constructor(public loginService : LoginService)