我有一个非常简单的angular2项目,配置为与Gulp,Bundle和ECM6一起使用。 Bundle将创建一个大文件,其中包含已转换的角度加上我的应用程序ECM5。
<!DOCTYPE html>
<html>
<head>
<title>Angular 2 Test</title>
<script src="bundle.js"></script>
</head>
<body>
<mainapp>
</mainapp>
</body>
</html>
角度应用程序定义如下:
import {Component, View, bootstrap} from 'angular2/core';
export class mainComponent {
static get annotations() {
return [
new Component({
selector: 'mainapp'
}),
new View({
template: `<div>Hello!</div>`
})
];
}
}
bootstrap(mainComponent);
然而,当我加载它时,我继续收到错误
"selector 'mainapp' did not match any element"
答案 0 :(得分:23)
问题是我在HTML中定义bundle.js
组件之前包含了mainapp
。这解决了这个问题。
<!DOCTYPE html>
<html>
<head>
<title>Angular 2 Test</title>
</head>
<body>
<mainapp>
</mainapp>
<script src="bundle.js"></script>
</body>
</html>
<强>更新强>
<script src="bundle.js" defer></script>
无论元素的顺序如何,似乎也解决了问题。