为什么Plunker没有加载AngularJS?

时间:2015-08-31 13:24:38

标签: javascript html angularjs plunker

我打开了一个干净的plunker编辑器,将Angular添加到其中并编写了一个表达式。但它不起作用。

link

代码:

<!DOCTYPE html>

    <html>



    <head data-ng-app="">
        <script data-require="angular.js@*" data-semver="2.0.0-alpha.31" src="https://code.angularjs.org/2.0.0-alpha.31/angular.js"></script>
        <link href="style.css" rel="stylesheet" />
        <script src="script.js"></script>
      </head>

      <body>
        <h1>Hello Plunker!</h1>
        <div>
          {{ 1 + 1 }}
        </div>
      </body>

    </html>

我是Angular和Plunker的新手。我使用的是Firefox。任何人都可以帮助我吗?

3 个答案:

答案 0 :(得分:0)

它不起作用,因为您将data-ng-app=""放在<head>标记而不是<body>{{ 1 + 1 }}。由于它不知道那里应该有应用程序,因此Angular不会评估该表达式并将其保留为{{ 1 + 1 }}而不是2。

您也在使用Angular 2.0而不是当前版本,这是与当前版本相比完整的Angular重制版本。为当前版本<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.4/angular.min.js" type="text/javascript"></script>添加脚本标记可以解决问题。

答案 1 :(得分:0)

我已经从google cdn更新了角度脚本。

您需要在脚本上添加一个模块。

<xsl:stylesheet version="2.0"
 xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:template match="@*|node()">
    <xsl:copy>
        <xsl:apply-templates select="@*|node()"/>
    </xsl:copy>
</xsl:template>
<xsl:template match="chap/text()" name="tokenize">
    <xsl:param name="separator" select="'&gt;'"/>
    <xsl:for-each select="tokenize(.,$separator)">
            <p>
                <xsl:value-of select="normalize-space(.)"/>&gt;
            </p>
    </xsl:for-each>
</xsl:template>

并在html页面中添加模块的引用

var app = angular.module('myApp',[]);

请参阅更新的plunker:http://plnkr.co/edit/ObpHaAeV9UXITNiCbhqf?p=preview

答案 2 :(得分:0)

使用New - &gt; AngularJS创建正确的角度plunker项目;

enter image description here