Question

我无法运行应用程序，因为错误“错误：模式'/ instance /中的重复参数名称'id'：id / instance /：id / edit'”

JS

routerApp.config(function($stateProvider, $urlRouterProvider) {

$urlRouterProvider.otherwise('/home');
$stateProvider
    .state('home', {
        url : '/home',
        templateUrl : 'home-view.html',
        controller : 'homeController'
    })
    .state('instance', {
        url : '/instance/:id',
        templateUrl : 'data-view.html',
        controller : 'instanceController'
    })
    .state('instance.edit', {
        url: '/instance/:id/edit', 
        templateUrl : 'edit-table.html',
        controller : 'instanceEditController'
    });

});

routerApp.controller('homeController', ['$scope', '$state', function($state, $scope) {
  console.log("inside home controller");
}]);

routerApp.controller('instanceController', ['$scope', '$state', function($state, $scope) {
  console.log("inside instance view controller");
  $scope.data = [
   {
     "Name" : "Hello"
   }  
  ]
}]);

routerApp.controller('instanceEditController', ['$scope', '$state', function($state, $scope) {
   console.log("inside instance edit controller");

}]);

如何在状态之间传递数据？我正在使用

<a ui-sref=".edit{{'id' : 2, 'data' : data}}" class="btn btn-primary">Instance View</a>

Plnkr：http://plnkr.co/edit/IMOYLn8dFzGM4p9OB7My?p=preview

Answer 1

你对AngularJS ui-router的嵌套状态感到有点困惑。

我修复了你的plnkr的一些问题：http://plnkr.co/edit/YF6ePE1ALdp7qsBaK6oD?p=preview
（还有其他问题，但它给你一个良好的开端）。

基本上，当你有嵌套状态时，你不需要复制整个URL，即：

发件人：

.state('instance.edit', { url: '/instance/:id/edit', templateUrl : 'edit-table.html', controller : 'instanceEditController' });

更改为：

.state('instance.edit', { url: '/edit', templateUrl : 'edit-table.html', controller : 'instanceEditController' });

对于嵌套状态，我建议使用此文档：Nested States & Nested Views

另一个问题，如何传递数据，你几乎就在那里：

ui-sref="instance({id:2})

在这里看一下这个演示：UI-Router Demo，它包含了你想要完成的一个很好的例子。

同样，ui-router wiki读得很好：angular-ui/ui-router

$ stateProvider中的状态URL无效

1 个答案: