La directive AngularJs ne fonctionne pas/visible

Question

Je ne fais que commencer avec AngularJs. Et j'essaye d'implémenter une directive de connexion. Mais je ne vois pas la sortie? Je n'ai pas d'erreur dans ma console.

Ma structure d'application:

(index.html est non visible)

login.directive.js:

(function() { 
    'use strict'; 

    angular 
     .module('lnjapp.login',[]) 
     .directive('login', login); 

    function login() { 
     var directive = { 
      template: '<p>test</p>', 
      //restrict: 'E', 
      Controller: LoginController, 
      controllerAs: 'vm' 
     }; 
     return directive; 
    } 
})(); 

app.js:

(function() { 
    'use strict'; 

    angular.module('lnjapp', ['ngRoute', 'ngCookies', 'angular.filter','lnjapp.login','lnjapp.config']) 
    .constant('GLOBALS', { 
     url:'http://domain.dev/api/v1/' 
    }); 

    $(document).ready(function() { 
     $.material.init(); 
    }); 
})(); 

app/pages/login.html:

<login></login> 

- EDIT -

login.controller.js:

(function() { 
    'use strict'; 

    angular.module('lnjapp.login',[]) 
    .controller('LoginController', LoginController); 

function LoginController() 
{} 
})(); 

route-c onfig.js:

angular 
    .module('lnjapp.config',[]) 
    .config(config); 

function config($routeProvider) { 
    $routeProvider 
     .when('/', { 
      templateUrl: '/app/pages/login.html' 
     }); 
} 

ce que je fais mal ici?

Answer 1

Vous créez votre deux fois lnjapp.login, une fois login.directive.js et à nouveau en login.controller.js. La deuxième fois que le module est créé, il écrase le premier, et tout ce qui a été créé dans le premier fichier ne sera plus accessible.

Vous devez toujours créer un module une seule fois et obtenir le module déjà créé pour ajouter des fonctionnalités supplémentaires dans tous les autres cas.

Set (créer): angular.module('lnjapp.login',[])

Get (consommer): angular.module('lnjapp.login')

Pour plus d'informations et d'autres bonnes pratiques, voir John Papa Excellents Angular Style Guide.