使用ui路由器将参数传递给URL

问题描述：

我一直在看这个例子，但我不知道我在做什么错。使用ui路由器将参数传递给URL

我将一个项目及其内容加载到ng-view。当我刷新页面时，它会消失。我已经将一个参数传递给了该州的URL，我失去了接下来要做的事情。

人们已经谈过我可以从我的控制器登录的$stateParams，我可以看到id: 3已被选中。

即使在刷新时如何保持视图中填充此项目？我的代码示例将不胜感激。

var app = angular.module('myApp', ['ngRoute', 'ui.router']); 

app.config(['$stateProvider', '$locationProvider', '$urlRouterProvider', '$routeProvider', function($stateProvider, $locationProvider, $urlRouterProvider, $routeProvider) { 

    $urlRouterProvider 
     .otherwise('/patents'); 

    $stateProvider 
     .state("patents", { 
      url: "/patents", 
      templateUrl: "templates/patents/list/list-patents.htm", 
      controller: "patentListCtrl", 
     }) 
     .state("patents.item", { 
      url: "/:id", 
      templateUrl: function() { 
       //THIS IS WHERE I AM NOT SURE HOW TO PASS THE URL THE ID 
      }, 
      controller: "patentItemCtrl" 
     }) 
}]); 

app.controller('patentItemCtrl', ['$scope', 'patentTabService','$stateParams', '$state', '$routeParams', function($scope, patentTabFactory, $stateParams, $routeParams){ 

     console.log($stateParams.id) 

}])

可能重复：https://stackoverflow.com/a/24261127/1457231 –

答

您应该能够通过呼叫您的数据服务，然后分配给您的视图来获取所需的数据。在你的案例中，调用patentTabService以获得专利，然后将该专利对象加载到您的视图中。例如，请注意我假设你已经有一些方式来获得由ID专利在服务：

app.controller('patentItemCtrl', ['$scope', 'patentTabService','$stateParams', '$state', '$routeParams', function($scope, patentTabFactory, $stateParams, $routeParams){ 
 
     $scope.patent = {}; 
 
     if (Number.isInteger($stateParams.id)){ 
 
     $scope.patent = patentTabFactory.getPatent($stateParams.id); 
 
     } 
 
     
 
     console.log($stateParams.id) 
 
}])

使用ui路由器将参数传递给URL

相关推荐