Question

我准备了一个模板如下

    <script type="text/ng-template" id="spinner.html">
        <div class="spinner">
          <div class="bounce1 spinner-bounce"></div>
          <div class="bounce2 spinner-bounce"></div>
          <div class="bounce3 spinner-bounce"></div>
          <div class="bounce4 spinner-bounce"></div>
          <div class="bounce5 spinner-bounce"></div>
        </div>
      </script>

    <!-- a couple of lines below -->

    <div spinner> </div>

使用以下指令

app.directive('spinner', function ($window) {
    return {
        restrict: 'A',
        templateUrl: '#spinner.html'
    };
});

因此，指令本身及其模板在同一个html中，tempateUrl未加载ng-template我在上面定义。这有什么问题？我也尝试了template，但它也没有用。

Answer 1

我意识到了这个问题。

这是因为我在text/ng-template代码中添加了<head>模板，而不是<body>代码。就我而言，它找不到我的模板并在服务器上搜索/spinner.html。

如何在Angular.js中的指令中使用相同html中的脚本模板

1 个答案: