$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 AS AS和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。我也关注了这个问题，但无法正常工作：如何在Angular-ui-router中以$ state.go((传递自定义数据？

Answer 1

在您的编辑状态中，您有两个参数，id和obj，其中一个参数。

但是，当您从控制器触发状态时，您不是传递ID参数，而您没有定义默认值

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

尝试在参数对象中添加它

params: {
   obj: null,
   id: null
}

编辑：

回答您的进一步问题：

<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});
}

Answer 2

嗨，如果要将参数传递到$ 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);
}