I have been struggling to bind a resolve value to an angularjs 1.5 component with no success. In the state definition, I substituted the usual template properties value with the name of my new component like this:
.state('eventslogs.create', {
url: '/create',
template: '<addevent data="$resolve.addevent"></addevent>',
resolve: {
addevent: newEventslog
},
data: {
roles: ['admin'],
pageTitle: 'Eventslogs Create'
}
})
The newEventslog function injects one of my services
newEventslog.$inject = ['EventslogsService'];
function newEventslog(EventslogsService) {
return new EventslogsService();
}
I have attempted various methods in my controller but nothing seems to work
angular.module('eventslogs')
.component('addevent', {
templateUrl: 'addevent.client.component.view.html',
bindings: {
data: '<'
},
controller: function($scope, $element) {
var vm = this;
vm.eventslog = vm.data;
}
However, vm.eventslog always returns as undefined. What could be wrong with my approach? If I use "@" instead of "<" in bindings, vm.addevent turns out to be a string with value "$resource.addevent" rather than an instance of newEventslog function.
I am using ui-route version 0.2.18