从模板中的Angular 4.5组件中获取值

Question

我正在开发Angular 4.5，我有自己的包含文件夹及其组件，模板和服务。我有方法可注射服务

服务

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

@Injectable()
 export class MsalService
{
   getProduct(): string
   {
      return "12 Apples";
   }
 }

和我打算调用此服务的组件，并将getProduct（）中的值打印到模板中;

登录组件

 import { Component } from '@angular/core';
 import { Location} from '@angular/common';
 import { MsalService } from '../Services/msal.service';

 @Component({
  selector: 'auth-login',
  templateUrl: './Login.Template.html',
  styleUrls: ['./Login.Style.scss'], 
  providers: [MsalService]
 })

  export class Login{

    constructor( private msalService: MsalService){
  }

  public pageTitle: string = "testing .....";

  getService() : void{
      this.msalService.getProduct();
  }

} 

模板，我试图从登录组件调用方法，并在单击事件发生时在模板中打印值

登录模板

<div class="panel-heading">
     {{pageTitle}}
</div>

<a class="btn btn-link"  (click)="getService()">Login</a>

最后我需要将另一个组件中的整个函数称为;

另一个模块

import { Login } from '../security/login/login.component';

@NgModule({
imports: [
 Login
  ]
})

 export class LayoutModule {
}

另一个模板，我想使用登录方法调用哪个是单独的完整函数，而对于简单的方法，打印值来自方法

getService() : void{
          this.msalService.getProduct();

 <p><auth-login></auth-login></p>

Answer 1

假设您需要打印该值。

new Error(...)

或其他

new Promise

模板

 getService(){
   return this.msalService.getProduct();
 }

Answer 2

这是我在模板中打印组件方法返回值的方法。

__not_so_private