Angular 如何将服务变量与组件2绑定？

我有一个变量：

public tick:number正在使用中

该服务已注入另一个服务计时器。它的启动方式如下：

class Service {

constructor(public timer: TimerService)

}

public sendSmsExect(){
   // Main sending
}

public sendSms(){

    this.timer.run().subscribe((tick => { if(tick == 30) { sendSmsExect(); } }));

}

}

组件：

class MyComponent {

    public constructor(public service Service){}

    public sendSms(){
       this.service.sendSms();
    }

}

问题：我需要访问模板中的勾号变量：

{{tick}} 

我真的认为我需要订阅组件中的
勾选
，并定义相同的变量
勾选
：

public sendSms(){
   this.service.sendSms().subscribe((tick) => this.tick = tick );
}

您可以考虑使用<代码>主题>代码>可观察到的共享<代码> TIK/<代码>变量值。通过使其可观察，您无需订阅它，也无需从中展开勾号的值。您需要在HTML上使用
| async
管道，它将负责展开
勾选
的值并将其显示在HTML上

代码

//don't miss below import
import { Subject } from 'rxjs/Subject';

class MyService {
  tick: Subject < number > ();
  constructor(public timer: TimerService) {}

  sendSmsExect() {
    // Main sending
  }
  tickObservable() {
    return this.tick.asObservable();
  }

  public sendSms() {
    this.timer.run().subscribe(tick => {
      this.tick.next(tick);
      if (tick == 30) {
        sendSmsExect();
      }
    );
  }
}

@Daniel请参考，您可能会发现有很多这样的线程非常有用：）@Daniel关于您的解决方案，我仍然想知道，
tick
value是如何在您的组件中可用的。虽然建议的方法是首选的..但我得到了语法错误：
tick:Subject（）
您从何处开始：
this.timer.run（）
？和另一个错误：
类型错误：无法读取SmsService上未定义的属性“asObservable”。tickObservable
//don't miss below import
import { Observable } from 'rxjs/Observable';

class MyComponent {
    tick: Observable<number>();
    public constructor(public service: MyService ){}

    sendSms(){
       this.service.sendSms();
    }
    ngOnInit(){
       this.tick = this.service.tickObservable();
    }
}

{{tick | async}}