Hokutosei Hokutosei - 1 month ago 13
AngularJS Question

angularjs 1.5 component dependency injection

this may sound newb, but I have been following this tutorial for angularjs component.

I am new to components and how do I inject a constant

Utils
or
authService
to my component like this?

app.component('tlOverallHeader', {
bindings: {
data: '='
},
templateUrl: 'js/indexTimeline/components/tl_overallHeader/templates/tl_overallHeader.html',
controller: function() {
this.ms = 'tlOverallheader!'
}
})


update1: tried something like from directives, but not working..

controller: function(Utils, authService) {
this.ms = 'tlOverallheader!'

Utils.log(authService.isAuthed(), '')
}


update2: working solution, fixed the
ngAnnotate
options

// gulp
.pipe(ngAnnotate({ add: true, single_quotes: true }))

// angular
controller: function(Utils, authService) {
this.ms = 'tlOverallheader!'

Utils.log(authService.isAuthed(), '')
}


thanks!

Answer

You should be able to inject services into your component's controller just like a standalone controller:

controller: function(Utils, authService) {
    this.ms = 'tlOverallheader!'

    authService.doAuthRelatedActivities().then(...);
}
Comments