21

Angular 2 rc 6, typescript 2, node 4.5.0,npm 2.15.9上Windows 7

我正在尝试从即时编译转移到提前编译，并且我依赖这些资源：

我知道我需要运行编译器ngc来生成ngfactory.ts文件，并且我需要更改main.ts为使用platformBrowser而不是platformBrowserDynamic引导。我遇到了障碍，不知道如何进行。

1.我已经确认应用程序使用即时编译运行没有错误。我main.ts的是：

enableProdMode();
platformBrowserDynamic().bootstrapModule(AppModule);

2.我从生产文件夹中清除了所有应用程序文件，但保留了第 3 方库（例如：Angular 2、Angular 2 Material）

3.我运行"node_modules/.bin/ngc" -p ./这个运行没有输出到控制台。我看到我.ngfactory.ts的每个.ts组件和模块都有一个文件。我还看到.css.shim.ts每个包含.css组件样式的文件。另外，.js和.js.map文件已被转译并放置在生产目录中

4.如果此时我尝试运行该应用程序，我会看到包含组件模板404 not found的所有文件的错误.html

5.我手动将所有模板文件 ( .html) 移动到生产目录并运行应用程序。它运行良好，但它仍然使用即时编译（255 个请求，包括compiler.umd.js）

6.我将我的更改main.ts为：

enableProdMode();
platformBrowser().bootstrapModuleFactory(AppModuleNgFactory);

就其本身而言，这没有任何区别，因为尚未编译新代码。但是，我不知道从这里做什么。

我应该再跑ngc一次吗？如果是这样，我会收到很多类型的错误：

Error at C:/path/to/notify.component.ngfactory.ts:113:41: Property 'visible' is private and only accessible within class 'NotifyComponent'
... (many more like that with lots of properties from lots of components)
Compilation failed

使用 AoT 编译是否意味着我必须公开我的所有类属性？我错过了一步吗？

4

2 回答 2

39

对于给定的组件，其模板访问的所有成员（方法、属性）在提前编译场景中必须是公共的。这是因为模板变成了 TS 类。生成的类和组件现在是 2 个独立的类，您不能跨类访问私有成员。

简而言之：如果您想使用提前编译，则无法访问模板中的私有成员。

于 2016-09-07T21:42:35.267 回答
4

在 Angular 2 whit Ionic2 RC1 的最终版本中也是如此

Fields 的解决方法可能是使用不带 setter 的 getter

protected _myField: any;

get myField(): any { 
  return this._myField; 
}

您还可以在Isaac Mann 的博客中查看其他从 JiT 到 AoT 的注意事项，以调整您的代码

  1. const lambda => 导出函数
  2. 默认导出 => 命名导出
  3. 对于从模板访问的任何成员，私有、受保护的访问器应更改为公共
  4. 动态组件模板 => 静态模板
  5. moduleId 应该在带有 templateUrl 的组件上设置
于 2016-11-05T21:31:08.930 回答