Angular 组件和助手服务或助手类

Question

我是 Angular 5 的新手。

我正在尝试构建具有大量逻辑的组件，这些逻辑准备数据以便能够以 HTML 格式显示。

据我所知-这个逻辑应该从组件移动到其他地方，以免触发更改跟踪。(正如样式指南中所说的here)

我这个其他地方应该是一个servie或helper类？如果它提供服务，它应该添加到该组件的组件模块的“提供者”还是添加到组件本身的“提供者”？

@Component({
    selector: 'filters-bar',
    templateUrl: './filters-bar.component.html',
    styleUrls: ['./filters-bar.component.scss'],
    providers:[FiltersFromQueryService]
})

谢谢

Answer 1

如果该类仅在一个组件中使用，则将其用作普通类(辅助类或我称之为 View 对象)。您不能将它们注入(inject)组件，但可以在每次初始化时创建新实例:this.viewObject = new ViewObject();

如果它在多个组件中使用，那么它应该在服务中，以便它可以注入(inject)多个组件(仅初始化一次，单例)。

提供者通常是单例对象。

当用@Injectable() 注释时，这:

@Component({})
class Cmp {
  constructor() {
    this.yourService= new YourService(...);
  }
}

...可以这样写:

@Component({
  ..
  providers: [YourService]
})

...或者像这样:

@Component({})
class Cmp {
  constructor(private yourService: YourService ) {
  }
}

是否是单例

您提供多少个可注入(inject)的位置决定了将创建多少个实例(它们仅在实际请求时实例化)。

如果您想要整个应用程序的单个实例，则只在根组件(或使用 bootstrap(AppComponent, [...]) 提供一次可注入(inject)，这会导致相同的行为。

如果你想为每个组件A创建一个新的实例，那么将它添加到组件A的提供者