Question

我是AngularJs的新手。我在Angular中创建了一个简单的自定义指令来打印出一些文本。代码如下：

var demoApp = angular.module('demo-app', ['ngRoute']);
demoApp.directive('helloWorld', function() {
  return {
    restrict: 'E',
    template: '<h1>Hello World!!</h1>'
  };
});

在html文件中我使用它如下：

<hello-world/>
<script type="text/javascript" src="js/demo-app.js"></script>

我没有看到输出＆＃34; Hello World！＆＃34;。请告诉我哪里出错了？我正在使用Angular 1.3版本。

Answer 1

我在我的项目中按照以下方式进行了操作，并且工作正常。

<强> customDirective.js

myApp.directive('viewTodoSuccessModal', function () {
    return {
        restrict: 'E',
        templateUrl: '/scripts/app-angular/directives/templates/view-todo-success-modal.html'
    };
});

<强> app.js

angular.module('myApp', [
  'myAppControllers'
  , 'myAppDirectives'
]);

在html页面中包含/引用

<script src="@Url.Content("~/Scripts/app-angular/app.js")"></script>
<script src="@Url.Content("~/Scripts/app-angular/Directives/CustomDirectives.js")"></script>

希望有所帮助

Answer 2

只需检查您的模块名称是否为＆＃39; demo-app＆＃39;在HTML或不。如果不是那么使其正确。脚本文件中的模块名称应与html文件相同。

<html ng-app="demo-app">  
 <head>    
   <script src="angular.js"></script>   
 </head>  
 <body>   
   <hello-world /> 
   <script type="text/javascript">
     angular.module('demo-app',[]);

     angular.module('demo-app')
      .directive('helloWorld', function() {
        return {
          restrict: 'E',
          template: '<h1>Hello World!!</h1>'
        };
      });
    </script>
  </body>
</html>

JS小提琴： http://jsfiddle.net/vSpR4/1/

angularJs自定义指令未被调用

2 个答案: