Question

我尝试将参数从浏览器中的网址传递到控制器，例如， 122 应该在控制器的$scope.id中传递，以便JSON加载是这个http://52.41.65.211:8028/api/v1/categories/122/books.json，不管怎样，不知道吗？

网址示例 http://www.example.com/categories/122

app.js

   ...  
    .when('/categories/:categoryId', {
        controller: 'BookCategoryController',
        templateUrl: 'views/booksincategory.html'
    })
    ...

控制器

app.controller('BookCategoryController', ['$scope', 'bookcategories', '$routeParams',  function($scope, bookcategories, $routeParams) {
    bookcategories.getAllBooks($scope.id).then(function(response) {
    $scope.detail = response.data.books[$routeParams.categoryId];
  });
}]);

服务

app.service('bookcategories', ['$http', function($http) {
  return {
    getAllBooks: function(id) {
      return $http.get('http://52.41.65.211:8028/api/v1/categories/'+ id + '/books.json')
     }
  }
}]);

booksincategory.html

  <div class="category col" ng-repeat="book in detail">
     <h3 class="title">{{book.title}}</h3>
  </div>

Answer 1

如果您的网址为http://www.example.com/categories/122，路由参数就像

.when('/categories/:categoryId', {
    controller: 'BookCategoryController',
    templateUrl: 'views/booksincategory.html'
})

然后您将获得控制器中的categoryId $routeParams.categoryId

只需设置$scope.id = $routeParams.categoryId;

即可

在调用服务之前，只需在控制器中设置它。所以你的控制器就像

app.controller('BookCategoryController', ['$scope', 'bookcategories', '$routeParams',  function($scope, bookcategories, $routeParams) {
    $scope.id = $routeParams.categoryId;
    bookcategories.getAllBooks($scope.id).then(function(response) {
       $scope.detail = response.data.books;
    });
}]);

只需使用

$scope.detail = response.data.books;

无需使用$ scope.detail = response.data.books [$ routeParams.categoryId];它的语法不正确。希望能为你效劳。您在控制器中错误地分配了$ scope.detail。我在HTML中看到任何问题

将参数传递给URL中的$ scope.id - angularJS

1 个答案: