如何在angular中设置路径参数并在控制器中访问？

Question

我正在尝试设置如下路线：

$stateProvider.state('transactions', {
                url: '/transactions',
                templateUrl: url,
                menu: 'Transactions'
            });

$stateProvider.state('audit', {
                url: '/transactions/:id/audit',
                templateUrl: 'url',
            });

我希望用户使用以下内容导航到审核页面 url:

/transactions/100/audit
/transactions/200/audit

我有一个按钮，它有一些逻辑可以将用户重定向到“审核”页面，但我对如何设置 $state 来实现这一点感到困惑？

$scope.redirectToAudit = function () {
                    $state.go('audit', {
                        id: $scope.transactionId
                    });
                }

因此，当单击此按钮时，我想将用户重定向到此路由“/transactions/100/audit”，并在审核日志页面的控制器中获取 transactionId 100。

var app = angular.module('myApp', []);
app.controller('auditCtrl', function($scope) {
    $scope.transactionId = //retrive transactionId from the path parameter
});

我想在审计中强制使用交易 ID URL /transactions/100/audit因为整个审计页面将只处理交易 ID。

如何设置我的 $stateProvider 以支持我上面描述的 URL 和功能？

Answer 1

如果这对你有用，请告诉我。

$stateProvider.state('transactions', {
    url: '/transactions',
    templateUrl: url,
    menu: 'Transactions'
});

$stateProvider.state('audit', {
    url: '/transactions/{id}/audit',
    templateUrl: 'url',
});

----------------------

var app = angular.module('myApp', []);
app.controller('auditCtrl', function($scope, $stateParams) {
    $scope.transactionId = $stateParams.id;
});
    
----------------------

app.controller('transactionsCtrl', function($scope, $state) {
    $scope.redirectToAudit = function () {
        $state.go('audit', {
            id: $scope.transactionId;
        });
    }
});

如何在angular中设置路径参数并在控制器中访问？

How to set up path paramater in angular and access in the controller?

javascript

angularjs

angular-ui-router