AngularJs 自定义指令未被调用

AngularJs custom directive not getting invoked

我是 AngularJs 的新手。我正在尝试调用自定义指令,但它没有被调用。

<head>
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
    <script src="customDirective.js"></script>
</head>
<body>
    <div ng-app="app">
        <div ng-controller="MyController as ctrl">
            <testingDirective></testingDirective>
            {{ctrl.test}}
        </div>

    </div>

</body>

我的 javascript 文件如下所示:

var app=angular.module('app',[]);
app.controller('MyController',[function(){
    var self=this;
    self.test='no';
    
    }]);
app.directive('testingDirective',function(){
    return{
            
            restrict:'AE',
            replace:true,
            template:'<h1>Hello World Test</h1>'
        };
    });

指令:

app.directive('testingDirective',function(){});

HTML 用法:

<testing-directive></testing-directive>

必须使用连字符调用驼峰式指令名称。例如,如果您有一个名为 myDirective 的指令,您可以在标记中将其用作 <my-directive></my-directive>.