可以将 @ViewChild 标记为私有吗？

Question

如果模板中未引用 ViewChild，是否可以将其标记为私有？

我已经能够做到这一点，然后使用“--prod”标志构建和服务，并且没有遇到任何错误。我目前正在使用 Angular 7.

@ViewChild(HelloComponent) private helloComponent;

这是我所说的堆栈闪电战：
https://stackblitz.com/edit/angular-vxbpuk?file=src%2Fapp%2Fapp.component.ts

我认为我有使用 aot 的 stackblitz，但你可以在本地验证同样的事情。

编辑：我很抱歉之前没有提出这个问题，但是 angular 文档中的这个简介让我停下来：

https://angular.io/guide/aot-compiler#phase-2-code-generation

Decorated component class members must be public. You cannot make an @Input() property private or internal.

但是正如@GCSDC 已经在下面指出的那样，Angular 团队似乎在他们的示例中使用了私有成员：
https://angular.io/guide/component-interaction#parent-calls-an-viewchild

Answer 1

似乎是的，这没关系，因为您可能会在官方 angular 基础指南中找到它，地址：

组件和模板 > 组件交互 > Parent calls an @ViewChild():

@ViewChild(CountdownTimerComponent) private timerComponent: CountdownTimerComponent;

Answer 2

是的，这样做没问题。由于这个变量作用域被限制在componentclass，我们可以声明它private并使用。

@ViewChild 是用来在 component 中与 child component 交互的，所以我们可以保留它 private.

Answer 3

private 和 public 语法是 javascript 语言的增强功能，用于 "static analyze" in typescript transpiler, I would recommend you to try the playground typescript 如何转译为 JS。所以基本上，任何阅读代码的人都可以通过这种方式了解 variables/functions 的范围。 class 中的一个简单变量的示例是它们都转译为相同的 JS private var1: number = 0 并且 public var1: number = 0 都转译为 this.var1 = 0

但是！在某些情况下，您实际上想从父组件访问@ViewChild，但在那种情况下，您必须将其设置为 @ViewChild(HelloComponent) public helloComponent; ，否则会出现 "compile/transpile" 错误。如果您想更清楚地了解范围的位置，请将其保留为 private 而不是像这样使用 getters/setters ：

export class MyComponent {

  @ViewChild(HelloComponent) private _helloComponent;

  get helloComponent(): any {
    return _helloComponent;
  }

  set helloComponent(set: any) {
    this._helloComponent = set;
  }

}

Answer 4

这是语法糖，你使用 typescript 只是确保有更少的错误并防止它们，但最终在编译代码之后所有的代码都被转译回 javascript。以及你如何使用上面的 private 关键字如果你只在当前 class 中使用这个变量它会很好但是如果你在构建项目和部署时在其他 class 中访问这个变量你会得到错误.

在 javascript 中没有私有或 public 一切都是闭包范围的。

可以将 @ViewChild 标记为私有吗？

Is it okay to mark a @ViewChild as private?

angular

private

angular7

viewchild

angular-aot