在Angular应用中,我看到@Component有moduleId属性。这是什么意思?
当模块。Id没有在任何地方定义,应用程序仍然工作。它怎么还能工作?
@Component({
moduleId: module.id,
selector: 'ng-app',
templateUrl: 'app.component.html',
styleUrls: ['app.component.css'],
directives: [AppComponent]
});
在Angular应用中,我看到@Component有moduleId属性。这是什么意思?
当模块。Id没有在任何地方定义,应用程序仍然工作。它怎么还能工作?
@Component({
moduleId: module.id,
selector: 'ng-app',
templateUrl: 'app.component.html',
styleUrls: ['app.component.css'],
directives: [AppComponent]
});
当前回答
Angular的beta版本(从版本2-alpha.51开始)支持组件的相对资产,比如@Component装饰器中的templateUrl和styleUrls。
模块。id在使用CommonJS时有效。你不需要担心它是如何工作的。
记住:设置moduleId: module。@Component装饰器中的id是 关键在这里。如果你没有,那么Angular 2会帮你找 用于根级别的文件。
来源来自Justin Schwartzenberger的帖子,感谢@Pradeep Jain
2016年9月16日更新:
如果你正在使用webpack进行捆绑,那么你不需要 模块。Id在decorator中。Webpack插件自动句柄(添加它) 模块。Id在final bundle中
其他回答
看起来如果你在tsconfig中使用"module": "es6"。Json,你不必使用这个:)
这个moduleId值被Angular的反射进程和metadata_resolver组件用来在组件被构造之前计算完全限定的组件路径。
添加moduleId: module。Id修复了在构建原生angular应用程序和angular web应用程序时可能出现的几个问题。使用它是最好的实践。
它还允许组件在当前目录中查找文件,而不是从顶部文件夹中查找
如果你得到typescript错误,只需在文件中声明变量。
// app.component.ts
declare var module: {
id: string;
}
//
@Component({
moduleId: module.id, // now it works without annoying Typescript
...
})
更新- 2016年12月8日
关键字module在node上可用。因此,如果你在你的项目中安装了@types/node,你将在typescript文件中自动获得module关键字,而不需要声明它。
install -D @types/node
根据您的配置,您可能必须在您的tsconfig中包含这个。Json文件获取工具:
//tsconfig.json
{
...
"compilerOptions": {
"types" : ["node"]
}
...
}
// some-component.ts
// now, no need to declare module
@Component({
moduleId: module.id, // now it works without annoying Typescript
...
})
祝你好运
Angular的beta版本(从版本2-alpha.51开始)支持组件的相对资产,比如@Component装饰器中的templateUrl和styleUrls。
模块。id在使用CommonJS时有效。你不需要担心它是如何工作的。
记住:设置moduleId: module。@Component装饰器中的id是 关键在这里。如果你没有,那么Angular 2会帮你找 用于根级别的文件。
来源来自Justin Schwartzenberger的帖子,感谢@Pradeep Jain
2016年9月16日更新:
如果你正在使用webpack进行捆绑,那么你不需要 模块。Id在decorator中。Webpack插件自动句柄(添加它) 模块。Id在final bundle中