angular - 在 ionic 2 angularjs 2 的几个视图之间共享一个函数

Question

在我使用 ionic 2 和 angularjs 的应用程序的几个视图中，我在每个页面上都使用了一些 ionic toast 消息。这些 toast 消息对于每一页都是相同的。

是否可以在可注入服务或其他东西中定义这些消息，而不是在所有 TS 文件中创建相同的功能？

Answer 1

就像@Austin 说的那样，你应该把你的逻辑放在一个injectable service：

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

@Injectable()
export class ToastService {
  constructor(...) {
      // ...
  }

  showToast() {
      //....
  }
}

然后只需将其包含在ionicBootstrap您的app.ts文件中，以确保在整个应用程序中使用相同的服务实例。

ionicBootstrap(MyApp, [ToastService], {});

最后，您可以通过以下方式使用它component：

import {Component} from '@angular/core';
import {ToastService} from './toastService';

@Component({
  templateUrl: 'build/test.html'

})
export class TestPage {
  constructor(private toastService: ToastService) {
    // ...
  }

  showMessage() {  
      // Use the service to show the message
      this.toastService.showToast();
  }
}