Angular2 Selector與bundle和ECM6的任何元素都不匹配

Question

我有一個非常簡單的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"

Answer 1

問題是我在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>

無論元素的順序如何，似乎也解決了問題。

Angular2 Selector與bundle和ECM6的任何元素都不匹配

問題描述

1 個解決方案

解決方案1
23 已采納 2016-01-12 11:10:57

Angular2 Selector與bundle和ECM6的任何元素都不匹配

問題描述

1 個解決方案

解決方案1 23 已采納 2016-01-12 11:10:57

解決方案1
23 已采納 2016-01-12 11:10:57