Question

我是Angularjs的新手。我正在尝试使用以下代码创建简单指令：

查看：

<html>
<script src= "http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
<body>
<div ng-app="myApp" ng-controller="myCtrl">
<user-info></user-info>
</div>

</body>
</html>

控制器：

myapp = angular.module("myapp", []);    
myapp.directive('userInfo', function() {
    var directive = {};
    directive.restrict = 'E'; /* restrict this directive to elements */
    directive.template = "My first directive: ";
    return directive;
});

我正在遵循本教程学习指令 http://tutorials.jenkov.com/angularjs/custom-directives.html

我收到错误：

http://errors.angularjs.org/1.3.14/$injector/modulerr?p0=myApp&p1=Error%3A%20%5B%24injector%3Anomod%5D%20http%3A%2F%2Ferrors.angularjs.org%2F1.3.14%2F%24injector%2Fnomod%3Fp0%3DmyApp%0A%20%20%20%20at%20Error%20(native)%0A%20%20%20%20at%20http%3A%2F%2Fajax.googleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.3.14%2Fangular.min.js%3A6%3A417%0A%20%20%20%20at%20http%3A%2F%2Fajax.googleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.3.14%2Fangular.min.js%3A21%3A412%0A%20%20%20%20at%20a%20(http%3A%2F%2Fajax.googleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.3.14%2Fangular.min.js%3A21%3A53)%0A%20%20%20%20at%20w.bootstrap%20(http%3A%2F%2Fajax.googleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.3.14%2Fangular.min.js%3A21%3A296)%0A%20%20%20%20at%20http%3A%2F%2Fajax.googleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.3.14%2Fangular.min.js%3A35%3A46%0A%20%20%20%20at%20s%20(http%3A%2F%2Fajax.googleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.3.14%2Fangular.min.js%3A7%3A302)%0A%20%20%20%20at%20g%20(http%3A%2F%2Fajax.googleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.3.14%2Fangular.min.js%3A34%3A399)%0A%20%20%20%20at%20ab%20(http%3A%2F%2Fajax.googleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.3.14%2Fangular.min.js%3A38%3A135)%0A%20%20%20%20at%20d%20(http%3A%2F%2Fajax.googleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.3.14%2Fangular.min.js%3A17%3A381

这是我的codepen链接 http://codepen.io/anon/pen/NGNKxz

Answer 1

您的应用名称中包含错误：

myapp = angular.module（＆＃34;我的 A pp＆＃34;，[]）; //不是＆＃39; myapp＆＃39;

Answer 2

添加您的指令

您需要将指令添加到您的html中，如此

<script src="path/to/your/directive.js"></script>

或者如果您从一个模块工作，您将链接到主模块。但请重新构建您的应用，例如this，它会使代码保持标准和清洁。

我有一个git hub repo，我正在这个结构here中构建一个应用程序。祝你好运。

注意

你正在使用角度分钟。 Min非常适合生产，因为它的体积小，加载速度快，但您目前正在开发中，因此请使用完整版本，以便您可以使用浏览器控制台更好地捕获错误。

Answer 3

看起来你没有声明控制器myCtrl。你的指示看起来很好。

myapp.controller('myCtrl', function() {
});

Answer 4

它是你的html文件的当前版本吗？

因为您可能需要链接控制器，在头标记之间插入：

<script src="the js file which contains your controller"></script>

或

<script>Your controller</script>

指令不适用于angularjs

4 个答案: