AngularJS：指令が正しく機能しない

Question

すべてのモジュールで同じ「検索」UIを作成しています。だから私は命令を書くことに決めました。私はモジュールとしてコードを注入するので、どこでもそれを再利用することができます。

注：このディレクティブがなければ、すべて動作します。私はちょうどディレクティブを正しく書く方法を理解しようとしています。ここに私のコードは次のとおりです。

マイディレクティブ：

var app = angular.module("azucarWeb", []); 
app.directive("buscadorPorLapso", function() { 
    return { 
     template : '<article ng-show="mostrarBuscador" class="buscadorPorLapso"> 
      <br/> 
      <input ng-keypress="traerDatos($event)" ng-model="lapso" type="tel" maxlength="6" class="lapso" placeholder="lapso"> 
      <button ng-click="traerDatos()">buscar</button>   
      <br/> 
     </article>' 
    }; 
}); 

マイビュー：

<section class="lo-nuevo">  
     <buscador-por-lapso></buscador-por-lapso> 
     <div id="tabla"> 
     </div> 
</section> 

マイコントローラ：あなたが制限欠けているすべての

angular.module('azucarWeb.CM_prendasPorM2', 
     [ 
      //in here all dependencies of this module 
      //any module going to or from here must be injected here 
     ]) 

    //configure the state and url address for this module 
    .config(function($stateProvider) { 
     $stateProvider 
      .state('CM_prendasPorM2', { 
       url: '/CM_prendasPorM2', 
       templateUrl: 'vistasYControladores/CM_prendasPorM2/CM_prendasPorM2.html', 
       controller: 'CM_prendasPorM2Ctrl' 
      }); 
    }) 
    .controller('CM_prendasPorM2Ctrl', function($scope, $state, cssInjector, $http) { 

     $scope.goToWebsite = function(address){ 
      window.open(address, '_blank'); 
     }; 
});//close controller 

Answer 1

多分、ここでいくつかのものを分けることができます。私は、ディレクティブ、コントローラー、工場をそれぞれのファイルに分けています。だから、そのファイルにはまた、すべてのあなたのhtmlは、そのためのファイルを作成

angular.module("buscadorPorLapso", []) .directive("buscadorPorLapso", function() { return { restrict : 'EA', templateUrl : 'path/to/html/file/youwant' }; });

を追加し、上記templateUrlで、そのファイルのパスをプラグmyDirective.jsを言うことができますディレクティブ・ファイルを持つことができます。依存関係として、メインのapp.jsファイルにbuscadorPorLapsoを挿入します。

Answer 2

まず「E '、デフォルトでは属性とクラスであるACですが、2番目のテンプレートをHTMLファイルに追加すると、HTML multiliを書くことはできませんね

Answer 3

コントローラがbuscadorPorLapsoをプロバイダとして取得しています。それを取り除くと、このエラーが発生します。それをコントローラに渡す理由はありますか？

.controller('CM_prendasPorM2Ctrl', function($scope, $state, cssInjector, $http) { 

    $scope.goToWebsite = function(address){ 
     window.open(address, '_blank'); 
    };