我们正在从 Angular 5 升级到 Angular 6。我们有一个共享库,但出现构建错误。作为 Java 商店,我们养成了将组件方法和属性标记为私有(private)的习惯。在 Angular 6 中构建我们的库时(在转换和使用新的库 CLI 功能之后),我们得到:
Property 'getCurrentYear' is private and only accessible within class.
实际上,模板 html 中使用的任何属性或方法都不能再在组件类上标记为私有(private)。当然,我们可以通过删除 'private' 修饰符来解决这个问题。当我们使用 https://github.com/raphael-volt/ng2-testable-lib 生成我们的库时,angular 5 的情况并非如此。 .
奇怪的是,这只发生在编译我们的库时。我们将一个应用程序升级到 Angular 6,它在模板中的组件/用法上也有私有(private)属性和方法,并且没有问题。
我们发现错误了吗?是否有我们没有遵守的最佳实践?
最佳答案
在 Angular 中我们有两种编译模型
JIT - Just-in-Time Compilation : JIT编译顾名思义,在浏览器中即时编译应用程序 运行时。
AoT - 提前编译:AoT 编译在构建时编译应用程序。
默认情况下,通过开发构建,即 ng serve
,我们可以进行 JIT 编译。这就是它的工作原理。浏览器下载应用程序代码和 Angular 编译器。在运行时,当向应用程序发出请求时,浏览器中的 JIT 编译器会在执行之前编译应用程序代码。
通过生产构建,即 ng build --prod
,我们获得了 AoT 编译, Angular 应用程序是预编译的。因此,这意味着浏览器加载可执行代码,以便它可以立即呈现应用程序,而无需先等待编译应用程序。
TypeScript public
无关紧要,但 private
重要
From Angular Docs
Alldata bound
properties must be TypeScript public properties. Angular never binds to a TypeScript private property.
实际上,它确实绑定(bind)到 private
属性,但不是在 AoT 模式
Why AOT Compiler requires public properties, while non-AOT allows private properties?
使用 JIT,我们将所有代码转换为 ES5,然后在运行时进行绑定(bind)。所有可见性修饰符都在该过程中丢失,因此您为此使用 public
还是 private
都没有关系。
另一方面,使用 AoT,我们为我们的模板生成一些 typescript 代码,这些代码将尝试访问这些字段。如果它们是 private
,则它们根本无法访问这些属性,因此,您需要将它们设置为 public
。
关于Angular 6私有(private)方法,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50354314/