eckig 1 - routing und api

Question

Der Versuch, ein einfaches SPA zu schreiben. Verwenden von MEAN.

API durch den Knoten alle arbeiten.

Haben

// create the module and name it 
var boardingApp = angular.module('boardingApp', ['ngRoute']); 


boardingApp.config(function($routeProvider) { 


    $routeProvider 

     // route for the home page that lists all tenants 
     .when('/', { 
      templateUrl : 'js/templates/tenants.html', 
      controller : 'tenantsController' 
     }) 
     // route for a specifc tenant 
     .when('/tenant/:id', { 
      templateUrl : 'js/templates/tenant.html', 
      controller : 'tenantController' 
     }) 

}); 

boardingApp.controller('tenantsController', ['$scope','$http','$log', function($scope, $http,$log) { 

     $http.get(URL + "/api/tenants") 
      .then(function(response){ $scope.details = response.data; }); 

}]); 

boardingApp.controller('tenantController', ['$scope','$http','$location','$log', function($scope, $http, $location, $log) { 



     if ($location.search().hasOwnProperty('id')) { 
      var myid = $location.search()['id']; 
      console.log(myid) 

      myURL = URL + "/api/tenants/"+myid 
      console.log(myURL) 

      $http.get(myURL) 
      .then(function(response){ $scope.tenant = response.data; }); 
      console.log($scope.tenant) 
     } 

}]); 

boardingApp.controller('readmeController', function($scope, $http) { 

     $scope.message = "This is the message" 


}); 

die Wurzel Route Arbeit findet ruft die API erzeugt eine Tabelle Routen in meinem Haupt-Controller einrichten. Alle guten

dann Hauptteil dieser Vorlage ist dies

<tbody id="tenantsTable"> 
         <tr ng:repeat = "tenant in details | filter : true: tenant.activeTenant "> 
         <td><a ng-href = "#/tenant.html?id={{tenant._id}}" >View</td> 
         <td>{{tenant.roomNumber}} </td> 
         <td>{{tenant.firstName}} </td> 
         <td>{{tenant.lastName}} </td> 
         <td>{{tenant.paymentFrequency}} </td> 
         <td>${{tenant.rentAmount}} </td> 
         <td> {{tenant.leaseEnd | date: 'dd MMM yyyy'}} </td> 
         </tr> 

         </tbody> 

ich auf den Link „Anzeigen“ klicken möchten und ziehen Sie Daten von DB für jeden Mieter durch und API-Aufruf, dass der Mieter-ID nur braucht - Standard-Zeug.

Mein Controller ist Kommissionierung die Anforderung nicht und wenn ich auf den Link auf der Seite Tennants klicken Sie endet kurz nach oben leer. hier

Was bin ich dabei? die api Anruf s sind alle gut und arbeiten gut

Answer 1

Sie Anker Registerkarte falsch ist, sollte es wie "#/tenant/{{tenant._id}}"

ng-href="#/tenant/{{tenant._id}}" 

Zusätzlich im richtigen Muster sein Sie eine Route Parameter innerhalb tenantController unter Verwendung $routeParams.id API abgerufen werden sollten statt $location.search(), die Abfrageparameter suchen würde.