Hey there! I'm currently working on a project using Ionic and Angular, where users can view events and see all the attending participants along with their information. To achieve this, I implemented a master-detail pattern within another master-detail (essentially a master-detail-detail).
The issue I am facing is that when trying to access the link
http://localhost:8100/evenement/1/deelnemers/1
, it returns a 404 error. The HTTP function is supposed to return a JSON object, but I haven't been able to test it due to the page or URL not being found.
app.js
// Ionic Starter App
var app = angular.module('newsApp', ['ionic']);
app.config(function($stateProvider, $urlRouterProvider){
$stateProvider
.state('list',{
url: '/',
templateUrl: 'list.html',
controller: 'ListCtrl'
})
.state('detail',{
url: '/evenement/:eventId',
templateUrl: 'detail.html',
controller: 'DetailCtrl'
})
.state('deelnemer', {
url: '/evenement/:eventId/deelnemers/:deelnemerId',
templateUrl: 'deelnemer.html',
controller: 'DeelnemerCtrl'
})
;
$urlRouterProvider.otherwise("/");
});
app.factory('Evenementen', function($http){
var cachedData;
function getData(callback){
var url = "http://localhost:8080/evenementen";
$http.get(url).success(function(data){
cachedData = data;
callback(data);
});
}
return {
list: getData,
find: function(pid, callback){
$http.get("http://localhost:8080/evenement/"+pid).success(function(data){
console.log("greater success");
console.log(data);
callback(data);
});
callback(event);
}
};
});
app.controller('ListCtrl', function($scope, $http, Evenementen){
$scope.news = [];
$scope.getMovieDB = function(){
Evenementen.list(function(evenementen){
$scope.evenementen = evenementen;
});
};
$scope.getMovieDB();
});
app.controller('DetailCtrl', function($scope, $http, $stateParams, Evenementen){
Evenementen.find($stateParams.eventId, function(evenement){
$scope.evenement = evenement;
$scope.deelnemers = evenement.alleDeelnemers;
});
});
app.controller('DeelnemerCtrl', function($scope, $http, $stateParams){
$http.get("http://localhost:8080/evenementen/"+ $stateParams.eventId+"/deelnemers/"+$stateParams.deelnemerId)
.success(function(data){
$scope.deelnemer = data;
});
});
app.run(function($ionicPlatform) {
$ionicPlatform.ready(function() {
if(window.cordova && window.cordova.plugins.Keyboard) {
cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
cordova.plugins.Keyboard.disableScroll(true);
}
if(window.StatusBar) {
StatusBar.styleDefault();
}
});
})