javascript – Angular2选择器与bundle和ECM6不匹配任何元素

前端之家收集整理的这篇文章主要介绍了javascript – Angular2选择器与bundle和ECM6不匹配任何元素前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我有一个非常简单的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"

解决方法

问题是在HTML中定义了mainapp组件之前,我已经包含了bundle.js.这解决了这个问题.
<!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>

似乎也解决了问题,而不管元素的顺序.

原文链接:https://www.f2er.com/js/153218.html

猜你在找的JavaScript相关文章