For Angle in angular 2抛出异常

时间:2015-12-09 09:24:05

标签: javascript angular

我已按照quickstart设置了引导程序。

的index.html

<!DOCTYPE html>
<html>
    <head lang="en">
        <meta charset="UTF-8">
        <title>Angular 2 Quickstart</title>
        <!-- Angular is working on removing the traceur dependency -->
        <script src="node_modules/angular2/bundles/angular2.sfx.dev.js"></script>
        <script src="https://github.jspm.io/jmcriffey/bower-traceur-runtime@0.0.87/traceur-runtime.js"></script>
        <script src="app.js"></script>
        <script src="components/display.js"></script>
    </head>

    <body>
        <my-app></my-app>
        <display></display>
    </body>
</html>

display.js

function DisplayComponent() {
    this.myName = "Jim";
    this.trophies = 'laugh';
    this.dogs = ['this','is','it'];
}

DisplayComponent.annotations = [
    new ng.ComponentMetadata({
        selector: "display"
    }),
    new ng.ViewMetadata({
        template:
            '<input [(ng-model)]="myName" type="text">' +
            '<h2>{{ trophies }}</h2>' +
            '<p>name: {{ myName }}</p>' +
            '' +
            '<ul>' +
            '   <li *ng-for="#dog of dogs">' +
            '       {{ dog }}' +
            '   </li>' +
            '</ul>',
        directives : [ng.FORM_DIRECTIVES]
    })
];

document.addEventListener('DOMContentLoaded', function() {
    ng.bootstrap(DisplayComponent);
});

由于某些原因,如果我删除for循环它再次工作并正常显示第一个变量,所以我猜它是一个语法错误,但它似乎匹配 documentation

1 个答案:

答案 0 :(得分:2)

注意:我不能对这篇文章发表评论。

您使用的是哪种角度? 因为以下内容对我有用:

<head lang="en">
    <meta charset="UTF-8">
    <title>Angular 2 Quickstart</title>
    <!-- Angular is working on removing the traceur dependency -->
    <script src="https://code.angularjs.org/2.0.0-alpha.47/angular2.sfx.dev.js"></script>
    <script src="https://github.jspm.io/jmcriffey/bower-traceur-runtime@0.0.87/traceur-runtime.js"></script>
    <script src="display.js"></script>
</head>

<body>
    <display></display>
</body>