Luculus Luculus - 16 days ago 15
AngularJS Question

AngularJS: Component controller not loaded when routing with ngRoute

I am an AngularJS beginner. I have the following code:

A component defined by the following js file:

angular.module('EasyDocsUBBApp')
.component('loginTag', {
templateUrl: 'login-tag/login-tag.html',
controller: function () {
alert(1);
this.login = function () {
console.log(this.username + ':' + this.password);
};
}
});


The content of my app.js file, where I also configured the routing is:

var app = angular.module('EasyDocsUBBApp', ['ngRoute']);

app.config(function ($routeProvider) {
$routeProvider
.when('/', {
templateUrl: 'login-tag/login-tag.html'
})
.when('/test', {
templateUrl: 'test.html'
})
.otherwise({
redirectTo: 'login-tag/login-tag.html'
});
});


My issue is that the controller is not loaded (the alert window does not appear). Could someone indicate me what I did wrong? (if any supplementary details on my code are needed, please tell me)

Answer

In your configuration for $routeProvider, try this:

.when('/', { template: '<login-tag></login-tag>' })

Remember to add your component.js to your index file.

Comments