I have developed a new service named servcises/employees.js:
angular.module('dashyAppApp')
.service('employees', function () {
this.getEmployees = function() {
return $.get( '/data/employee.json' );
};
});
The purpose of this service is to retrieve and read the json file located in the data folder.
{
"countries": [
{
"country": "Cameroon",
"employ_count": 50,
},
{
"country": "United States",
"employ_count": 738
}
]
}
This is my controllers/main.js :
.controller('MainCtrl', function ($scope, employees, Markers) {
var _this = this;
employees.getEmployees().then(
function(data) {
_this.items = data;
}
);
});
And here is how I display the data in my view:
<div ng-repeat="item in main.items.countries">
<h4>{{item.country}}</h4>
</div>
However, I am encountering an issue where nothing appears on the screen. I'm currently unsure of what mistake I might be making.