Question

所以我在这里开始使用我的角度应用程序。我试图让顶层菜单成为一个注入为元素的指令。该元素称为产品选项卡，您可以在代码块的中心看到。在那之下，我完全按照指令模板中的显示复制了控制器。

<!DOCTYPE html>
<html ng-app="myApp">
  <head>
    <title></title>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">

    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.7/angular.min.js"></script>

    <script type="text/javascript" src="js/app.js"></script>
  </head>

  <body>


<product-tabs></product-tabs>

<section>
  <ul class="nav nav-pills">
    <li ng-class="{ active:tab.isSet(1) }">
      <a href ng-click="tab.setTab(1)">Description</a>
    </li>
    <li ng-class="{ active:tab.isSet(2) }">
      <a href ng-click="tab.setTab(2)">Specs</a>
    </li>
    <li ng-class="{ active:tab.isSet(3) }">
      <a href ng-click="tab.setTab(3)">Reviews</a>
    </li>
  </ul>
</section>

  </body>
</html>

这是JS文件

var app = angular.module("myApp", []);
//top menu header stuff
app.directive("productTabs", function() {
  return {
    restrict: "E",
    templateUrl: "product-tabs.html",
    controller: function() {
      this.tab = 1;

      this.isSet = function(checkTab) {
        return this.tab === checkTab;
      };

      this.setTab = function(activeTab) {
        this.tab = activeTab;
      };
    },
    controllerAs: "tab"
  };
});

Answer 1

如果您的错误发生如下：

angular.js:68 Uncaught Error: [$injector:modulerr] Failed to instantiate module myApp due to:
Error: [$injector:nomod] Module 'myApp' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument.
http://errors.angularjs.org/1.5.7/$injector/nomod?p0=mainApp
    at file:///D:/Tutorials/AnjularjS/Controllers/lib/angular.js:68:12
    at file:///D:/Tutorials/AnjularjS/Controllers/lib/angular.js:2075:17
    at ensure (file:///D:/Tutorials/AnjularjS/Controllers/lib/angular.js:1999:38)

最有可能的是，你在你的html中输入了错误的src路径。再次检查你的lib / app.js：

<script type="text/javascript" src="js/app.js"></script>

Answer 2

这是几件事的组合。我有一个额外的指令是不完整的，触发了初始错误，然后我不得不开始在firefox中测试以使其工作，因为chrome不喜欢从其他文件中本地引用文件，我也在做。

Angular不想将我的元素注入页面

2 个答案: