angulaire - Comment déplacer directive personnalisée dans un fichier séparé

Question

Je regarde ce code:

app.directive('resizer', ['$window', function ($window) { 
    return { 
     restrict: 'A', 
     link: function (scope, elem, attrs) {    
      angular.element($window).on('resize', function() { 
       $window.innerWidth > 500 ? 
        elem.addClass('large') : elem.removeClass('large') 
      }); 
     } 
    } 
}]); 

Source: SO Link

Je veux placer cela dans un fichier séparé, donc dans mon application dépendances je l'ai fait:

var app = angular.module('app', [.....]) .directive("resizer", resizer)

puis dans ce nouveau fichier, je l'ai écrit:

var resizer = function() { 
    return { 
     restrict: 'A', 
     link: function (scope, elem, attires, $window) { 
      angular.element($window).on('resize', function() { 
       $window.innerWidth > 500 ? 
        elem.addClass('large') : elem.removeClass('large') 
      }); 
     } 
    } 
} 

Cependant, il ne fonctionne pas - quelqu'un pourrait m'aider à comprendre ce qui ne va pas ici s'il vous plaît.

Merci.

Answer 1

vous pouvez le faire avec les éléments suivants:

angular.module('app').directive('resizer', ['$window', function ($window) { 
    return { 
     restrict: 'A', 
     link: function (scope, elem, attrs) {    
      angular.element($window).on('resize', function() { 
       $window.innerWidth > 500 ? 
        elem.addClass('large') : elem.removeClass('large') 
      }); 
     } 
    } 
}]); 

il vous suffit d'initialiser votre module avant quelque part avec ses dépendances:

angular.module('app', [.....]); 

---

une raison pour laquelle votre code ne fonctionne pas , peut-être vous avez nommé la directive erronée. Dans le premier exemple, vous avez écrit resizer, dans le 2ème vous l'avez nommé resize.