MEAN堆棧傳遞參數在路由器內

Question

我是MEAN堆棧開發的新手。試圖按照這個教程https://thinkster.io/mean-stack-tutorial/來獲得一個簡單的Web應用程序工作。我在下面發佈了我的代碼。我創建了一個名爲post的中間層參數（請參閱router.js文件）以獲取特定帖子。在我的postCtrl中，我想將post/postId傳遞給工廠並獲取特定的帖子。 //$scope.post = postFactory.getById（id）; 根據本教程，應該從URL路由中自動檢測帖子。所以我想知道我應該如何利用它來獲得我想要的帖子？感謝您的時間提前

AngularController.js

var app = angular.module("littleStar" , ["service", "ui.router"]); 
 
app.config([ 
 
    '$stateProvider', 
 
    '$urlRouterProvider', 
 
    function($stateProvider, $urlRouterProvider) { 
 

 
     $stateProvider 
 
      .state('home', { 
 
       url: '/home', 
 
       templateUrl: "/home.html", 
 
       controller: 'mainCtrl' 
 
      }) 
 
      .state('post', { 
 
       url:'/post/{id}', 
 
       templateUrl: '/post.html', 
 
       controller:'postCtrl' 
 
      }); 
 

 
     $urlRouterProvider.otherwise('home'); 
 
    }]); 
 

 

 
app.controller("mainCtrl", ["$scope", "$http", "postFactory", function ($scope, $http, postFactory) { 
 
    postFactory.get().success(function(data){ 
 
     $scope.posts = data; 
 
    }); 
 

 
    $scope.addPost = function() { 
 
     var title = $scope.title; 
 
     var link = $scope.link; 
 
     if (!title || title === "" || !link || link === "") { 
 
      return; 
 
     } 
 
     var newPost = { 
 
      "title": title, 
 
      "link": link 
 
     } 
 
     postFactory.create(newPost) 
 
      .success(function (data) { 
 

 
       postFactory.get().success(function(allPosts){ 
 
        $scope.posts = allPosts; 
 

 

 
       }); 
 

 
      }); 
 
     $scope.title = ""; 
 
     $scope.link = ""; 
 

 
    }; 
 

 
    $scope.incrementPost = function(post){ 
 
     post.upvotes += 1; 
 
    }; 
 
}]); 
 

 

 
app.controller("postCtrl", ["$scope", '$stateParams', "postFactory", function($scope, $stateParams, postFactory){ 
 
    //$scope.post = postFactory.get($stateParams.id); 
 
    //$scope.post = postFactory.getById($stateParams.id); 
 

 
    $scope.addComment = function(){ 
 
     var currentComments = postFactory.post[$stateParams.id].comments; 
 
     currentComments.push({ 
 
      author:$scope.author, 
 
      body: $scope.body, 
 
      upvotes: 0 
 
     }); 
 

 
     $scope.body = ""; 
 
    } 
 

 
    $scope.incrementComment = function(comment){ 
 
     comment.upvotes += 1; 
 

 
    } 
 
}]);

router.get('/posts/:post', function(req, res) { 
     res.json(req.post); 
    }); 

    router.param('post', function(req, res, next, id) { 

     var query = Post.findById(id); 

     query.exec(function (err, post){ 
      if (err) { return next(err); } 
      if (!post) { return next(new Error('can\'t find post')); } 
      console(id); 
      req.post = post; 
      return next(); 
     }); 
    }); 

angularService.js

var service = angular.module("service", []); 

    service.factory("postFactory", ["$http", function($http){ 
      return { 
       get : function(){ 
        return $http.get("/posts"); 
       }, 
       create: function(newPost){ 
        return $http.post("/post", newPost); 
       }, 
       delete : function(id){ 
        return $http.delete("/post/" + id); 
       }, 
       getById : function(id){ 
        return $http.get("posts/" + id); 
       } 
      } 


    }]); 

Answer 1

您應該能夠使GET後路線採用以下方式：

router.get('/posts/:post', function(req, res) { 
     var query = Post.findById(req.params.post); 

     query.exec(function (err, post){ 
      res.json(post); 
     }); 
    });