I'm new to angularJs and I created an application which uses ui-routing in it and first loads the Config file which has a default state which calls the component and this component calls the service which fetches the data from API.I took this structure from a plunker example.When I run the page it loads the page -> Config -> Component and then throws below error.When i clicked on the error message it said it was related to now declaring the injector correctly. Find the code and error message below.
Config File(config.js)
var myApp = angular.module('EmpList', ['ui.router', 'ui.router.visualizer']);
alert('config');
myApp.config(function($stateProvider) {
// An array of state definitions
var states = [
{
name: 'hello',
url: '',
// Using component: instead of template:
component: 'Get',
resolve: {
people: function(PeopleService) {
return PeopleService.getAllPeople();
}
}
}
]
// Loop over the state definitions and register them
states.forEach(function(state) {
$stateProvider.state(state);
});
});
Component(people.js)
angular.module('EmpList').component('Get', {
bindings: { people: '<' },
template: '<h3>Some people:</h3>'
})
Service(people.js)
angular.module('EmpList').service('PeopleService', function($http) {
var service = {
getAllPeople: function() {
return $http.get('http://localhost:50164/api/Employee/get').then(function(resp) {
return resp.data;
});
}
}
return service;
})