angularjs - angular.js ui-router 将变量传递给状态 url

Question

我正在尝试将参数传递给 angular.js ui-router 中的状态，如下所示:

.state('details', {
    url: '/details/:index',
    templateUrl: 'views/details.html'
})

该索引正在通过 ng-repeat 索引传递

 <div ng-repeat="program in programs">
            <h2>{{program.name}}</h2>

            <p>{{program.description || "No Description"}}</p>

            <p><a ui-sref="details({index: $index})">View details »</a></p>
 </div>

我的问题是如何在 details.html 中读取状态 url 中传递的索引？

Answer 1

注入(inject) $stateParams在您的 Controller 中。

Example .

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

  // For any unmatched url, send to /route1
  $urlRouterProvider.otherwise("/route1/2")

  $stateProvider
    .state('route1', {
        url: "/route1/:index",
        templateUrl: "route1.html",
        controller: function($stateParams, $scope) {
            $scope.index = $stateParams.index 
        }
    })
    .state('route2', {
        url: "/route2",
        templateUrl: "route2.html"
    })
});