無效狀態URL $ stateProvider

Question

我無法運行，由於應用程序錯誤「錯誤：重複的參數名稱模式‘身份證’‘/實例/：ID /實例/：ID /編輯’」

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路由器的嵌套狀態。

我解決了你的一些問題：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