AngularJS中的多个指令

Question

我为2个div定义了两个指令：一个用于验证电话号码，另一个用于电子邮件验证。 这里的问题是，当我运行它时，它将仅执行一个指令，该指令在directives.js文件中作为第二个给出。 在HTML页面中，电话号码和电子邮件有两个不同的div。 我该如何解决？

<div id=maindiv><div class="number"><input id="Cont_No" name="phone" type="text" data-phone placeholder="ENTER NUMBER" ng-model="phone"/></div><div class="mail"  ><input id="Cust_Email" name="email" type="email" data-email placeholder="ENTER EMAIL" ng-model="email" /></div></maindiv>.

上面给出了HTML，下面给出了指令描述

angular.module('myApp.directives', []).directive('email', function() {
return {
    restrice: 'A',
    require: 'ngModel',
    link: function(scope, element, attrs, ctrl) {
        angular.element(element).bind('blur', function() {
//some code
});              
    }            
}        

}）;

angular.module('myApp.directives', []).directive('phone', function() {
return {
    restrice: 'A',
    require: 'ngModel',
    link: function(scope, element, attrs, ctrl) {
      //console.log("helo");
        angular.element(element).bind('blur', function() {
//some code
 });              
    }            
}        
});

在这里，只有phone指令被执行。

Answer 1

我不确定，但是我相信问题可能是您基本上是通过两次调用module('moduleName', [])覆盖模块。

尝试使用module('moduleName', [])调用第一个指令，并使用module('moduleName')调用第二个指令

Answer 2

嗨，我认为您的映射有误。 用您的代码尝试我的示例 。 看来您没有初始化模块。