$ state.go不傳遞參數

Question

這是我的HTML的一部分：

<td> 
    <button class="btn btn-primary" ui-sref="edit({id: v.customerId})" ui-sref-opts="{reload: true}">Edit</button> 
    <button class="btn btn-primary" ng-click="removeRow(v.firstName);">Delete</button> 
</td> 

，你可以看到我傳遞customerId作爲和id是在URL

顯示的參數之一

app.js：

var app = angular.module('webtrekkApp', ['ngSanitize', 'ui.router']); 
app.config(function ($stateProvider, $urlRouterProvider) { 
    $stateProvider 
     .state('edit', { 
      name: 'edit', 
      url: '/users/:id/edit', 
      templateUrl: './views/customer-details.html', 
      controller: 'ctrl', 
      params: { 
       obj: null 
      } 
     }); 
}); 

ctrl.js：

//If 'initData' isn't set, then set it up by default 
    if(!localStorage.getItem('initData')) { 
     $window.localStorage.setItem('initData', JSON.stringify($scope.initData)); 
    } 
    $scope.retrievedData = JSON.parse($window.localStorage.getItem('initData')); 
    for (var i = 0; i < $scope.retrievedData.length; i++) { 
     $scope.retrievedData[i].birthdayDate = new Date().getFullYear() - new Date($scope.retrievedData[i].birthdayDate).getFullYear(); 
    } 
    $scope.sortedType = 'firstName'; 
    $scope.sortedReverse = false; 
    //Remove Rows and Update localStorage Key Values 
    $scope.removeRow = function(name) { 
     var index = $scope.retrievedData.findIndex(function(obj) {return obj.firstName === name}); 
     $scope.retrievedData.splice(index, 1); 
     window.localStorage.setItem('initData', JSON.stringify($scope.retrievedData)); 
    }; 
    $state.go('edit', {obj: $scope.retrievedData}); 

所以我是一個表格，當用戶點擊'編輯'時，我需要THAT object傳遞給ui.router，以便我可以在customer-details.html中顯示它。我該怎麼做？我在這裏做錯了事。我已經閱讀了關於ui.router的所有文檔，但不知道應該在初始控制器還是在其他控制器中定義$state.go。我也跟着這個問題，但不能得到它的工作：How to pass custom data in $state.go() in angular-ui-router?

Answer 1

嗨，你沒有使用控制器，如果你想傳遞參數到$ state.go（）你應該有控制器來獲得該值特別是州。

app.js

var app = angular.module('webtrekkApp', ['ngSanitize', 'ui.router']); 
app.config(function ($stateProvider, $urlRouterProvider) { 
    $stateProvider 
     .state('edit', { 
      name: 'edit', 
      url: '/users/:id/edit', 
      templateUrl: './views/customer-details.html', 
      controller: 'myController', 
      params: { 
       obj: null 
      } 
     }); 
}); 

在控制器

function myController($state) { 
    conrole.log($state.params.obj); 
} 

Answer 2

在你的編輯狀態，你有兩個參數，id和obj，該網址內的一個。

但是，當你從你的控制器，你不通過id參數觸發狀態，你沒有定義裏面的params對象

params: { 
    obj: null, 
    id: null 
} 

編輯默認值

$state.go('edit', {obj: $scope.retrievedData}); 

嘗試添加它：

回答您的進一步問題：

<button class="btn btn-primary" ng-click="handleItem(v);">Go to Edit state</button> 

$scope.handleItem = function(item){ 
//here extract your item specific data from $scope.retrievedData then change the state 
var itemData = getItemData(item, $scope.retrieveData); 
$state.go('edit', {obj: itemData}); 
}