Typescript依赖注入公共与私有

new9mtju  于 2022-12-30  发布在  TypeScript
关注(0)|答案(4)|浏览(134)

用public和private注入服务有什么区别?我看到大多数例子都在Angular 组件中使用private关键字。这会对使用public有什么影响吗?

constructor(public carService: CarService) { }

对比

constructor(private carService: CarService) { }
vom3gejh

vom3gejh1#

除了前面的答案之外......组件的模板也不能访问任何标记为private的成员。(当使用JIT时,例如在开发时,可以访问private成员,但是当使用AOT时,例如在生产中,则不能访问private成员。)
因此,在您的模板中,如果注入的服务被标记为public,则只能执行*ngIf='carService.isValid'
但实际上,最佳实践是将任何服务属性/方法 Package 在组件属性/方法中,并让模板绑定到/调用组件的属性或方法。
大概是这样的

get isValid(): boolean {
      return this.carService.isValid;
   }

然后像这样访问它:*ngIf='isValid'

xwmevbvl

xwmevbvl2#

答案很简单:当你不需要在当前类/组件之外使用私有变量时,你必须创建私有变量,否则,你应该创建公共变量。还有一件事:也可以使用私有变量,并通过名为getterssetters的特殊函数从外部访问它们。例如:

private _customValue: any;

set customValue(newValue: any): void {
  this._customValue = newValue;
}

get customValue(): any {
  return this._customValue;
}

注意,_customValue是私有的,但是您可以通过customValue的操作从类外部设置/获取该值:

classInstance.customValue = 'newValue';
console.log(classInstance.customValue);

需要说明的是,方法名称之前的setget关键字并不是非常必要的,它们更多的是为了澄清。

wfsdck30

wfsdck303#

例如,当您有一项服务时:

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

@Injectable({
  providedIn: 'root'
})

export class CarService {

  constructor() { }

  public design = {
    "color": "blue"
  }
}

在构造函数中,您将在其中实现服务

constructor(private carService: CarService) { }

您可以使用正常的方法返回服务

getCarService() {
      return this.carService;
 }

在你的模板里你可以

<div>{{getCarService().design.color}}</div>
o2g1uqev

o2g1uqev4#

我没有足够的声誉,但这应该是对@apaternina回答的评论。
在模板中调用方法不是一个好主意--AniNaslyan
正确,但为了避免混淆,这仅适用于template expressions,因此:

<button (click)="onClick()"><button>

就可以了。
如上所述,控制台日志将向您显示发生了什么。原因是OnChanges必须在每次更改时运行该方法,以确定值是否已更改,如果您在模板中使用getter或value,则它可以在不再次运行函数的情况下进行比较。-- AlleXyS
getter也是函数,所以在每个OnChanges周期中仍然会被调用。在模板中很难发现它们,因为调用它们时不需要()
所以要避免函数,包括模板表达式中的getter。
了解更多关于here的信息。
如果您需要访问模板中的服务属性,我认为最好是直接为其分配一个变量,我同意不像其他答案中所述的那样注入公共服务。

var: type = this.service.var;

如果你在getter中有一些操作,那么就创建一个pure pipe

相关问题