离子/角度 - 主要细节内的主要细节

时间:2016-08-09 20:14:52

标签: javascript angularjs rest ionic-framework

您好我正在尝试开发(使用离子,也是角度)一个功能,用户可以在其中查看所有事件,并查看所有与会者。在所有这些参与者中都有可用的信息,因此我尝试在主细节中制作主 - 细节模式(所以基本上是主 - 细节 - 细节)。

问题是,它返回404而链接是http://localhost:8100/evenement/1/deelnemers/1而http函数应该返回一个JSON对象但我无法测试它自页面或网址没找到。

app.js

// Ionic Starter App

// angular.module is a global place for creating, registering and retrieving Angular modules
// 'starter' is the name of this angular module example (also set in a <body> attribute in index.html)
// the 2nd parameter is an array of 'requires'
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 succes");
    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) {
      // Hide the accessory bar by default (remove this to show the accessory bar above the keyboard
      // for form inputs)
      cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);

      // Don't remove this line unless you know what you are doing. It stops the viewport
      // from snapping when text inputs are focused. Ionic handles this internally for
      // a much nicer keyboard experience.
      cordova.plugins.Keyboard.disableScroll(true);
    }
    if(window.StatusBar) {
      StatusBar.styleDefault();
    }
  });    
})

1 个答案:

答案 0 :(得分:0)

Angular和ion使用哈希,所以你的网址应该是:

http://localhost:8100/#/evenement/1/deelnemers/1