链接

时间:2016-06-07 06:57:33

标签: javascript angularjs angular-ui-router ui-sref

在Angular的路由器中我有一个网址,但我不知道如何在此链接中添加params。

router.js

.state("support.root.gateways.invitationDetails", {
        url: "/invitations/details?invitationToken",
        templateUrl: "gateways/views/IvnitationDetails.html",
        controller: "InvitationDetailsController as ctrl",
        data: {
            title: "TITLE_GATEWAYS",
            requireLogin: true,
            roles: [
                ROLES.ROOT,
                ROLES.ADMIN,
                ROLES.SUPPORT3,
                ROLES.SUPPORT2,
                ROLES.SUPPORT1,
                ROLES.ENDUSER,
                ROLES.MAINTAINER
            ]
        }
    })

View.html

<td>
    <a href="" ui-sref="support.root.gateways.invitationDetails({   invitationToken:  ctrl.invitationToken})">
        {{ "INVITATIONS_DETAILS" | translate}}
    </a>
</td>

InvitationDetailsController.js

angular.module("support.gateways")
    .controller("InvitationDetailsController", function(Gateways, $stateParams) {
    var vm = this;
    vm.invitationToken = $stateParams.invitationToken;
    alert($stateParams.invitationToken);
});

2 个答案:

答案 0 :(得分:2)

您可以通过将 router.js 中的网址更改为:

来执行此操作
url: "/invitations/details/:invitationToken"

答案 1 :(得分:0)

.state('support.root.gateways.invitationDetails', {
    url: '/invitations/details?invitationToken',
    templateUrl: "'gateways/views/InvitationDetails.html',
    controller: 'InvitationDetailsController',
    controllerAs: 'ctrl',
    params: {
      invitationToken: null
    },
    data: {
        title: 'TITLE_GATEWAYS',
        requireLogin: true,
        roles: [
            ROLES.ROOT,
            ROLES.ADMIN,
            ROLES.SUPPORT3,
            ROLES.SUPPORT2,
            ROLES.SUPPORT1,
            ROLES.ENDUSER,
            ROLES.MAINTAINER
        ]
    }
})

在stateProvider的状态下,我更改了控制器行并添加了 controllerAs ,还添加了参数行。

然后为您的链接,按照您的方式进行操作:

<a href="" ui-sref="support.root.gateways.invitationDetails({ invitationToken:  ctrl.invitationToken})">
  {{ "INVITATIONS_DETAILS" | translate}}
</a>