Question

我有这个状态：

}).state('sport', {
    url: "/:sport",
    templateUrl: '/app/sports/sport.tpl.html',
    controller: 'SportController',
    controllerAs: 'controller'
});

，控制器如下所示：

.controller('SportController', ['$stateParams', function ($stateParams) {
    var self = this;

    // Object to hold our parameter
    self.slug = $stateParams.sport;
}]);

所以，我想要做的是将此参数传递给另一个状态。我设置的是这样的：

.config(['$stateProvider', function ($stateProvider) {

    // Set up our state(s)
    $stateProvider.state('sport.designer', {
        url: "/designer",
        abstract: true,
        templateUrl: '/app/designer/designer.tpl.html',
        controller: 'DesignerController',
        controllerAs: 'controller'
    }).state('sport.designer.team', {
        url: "",
        templateUrl: '/app/designer/team.tpl.html'
    }).state('sport.designer.kit', {
        url: "/kit",
        templateUrl: '/app/designer/kit.tpl.html'
    }).state('sport.designer.design', {
        url: "/design",
        templateUrl: '/app/designer/design.tpl.html'
    }).state('sport.designer.refine', {
        url: "/refine",
        templateUrl: '/app/designer/refine.tpl.html'
    }).state('sport.designer.order', {
        url: "/order",
        templateUrl: '/app/designer/order.tpl.html'
    });
}])

，控制器如下所示：

.controller('DesignerController', ['$stateParams', 'DesignerService', 'HttpHandler', 'Api', function ($stateParams, service, handler, api) {
    var self = this;
    var slug = $stateParams.sport; // Get our slug

    console.log(slug);
}]);

所以，这里有几个问题。

如果设置了这样的链接： ui-sref =＆＃34; sport.designer.team（{sport：controller.slug}）＆＃34; 那么视图就没有了＃39 ; t从运动状态移动。
我使用 .team 的原因是因为 .designer 是抽象状态，而团队状态是加载的默认状态

这是我的运动状态的html：

<a ui-sref="sport.designer.team({ sport: controller.slug })">Test</a>

谁能看到我做错了什么？

Answer 1

我今天工作了。我的运动状态保持不变。我将设计师的状态改为：

// Set up our state(s)
$stateProvider.state('designer', {
    url: ':sport/designer',
    abstract: true,
    templateUrl: '/app/designer/designer.tpl.html',
    controller: 'DesignerController',
    controllerAs: 'controller'
}).state('designer.team', {
    url: '',
    templateUrl: '/app/designer/team.tpl.html'
}).state('designer.kit', {
    url: '/kit',
    templateUrl: '/app/designer/kit.tpl.html'
}).state('designer.design', {
    url: '/design',
    templateUrl: '/app/designer/design.tpl.html'
}).state('designer.refine', {
    url: '/refine',
    templateUrl: '/app/designer/refine.tpl.html'
}).state('designer.order', {
    url: '/order',
    templateUrl: '/app/designer/order.tpl.html'
});

然后在我的sport.tpl.html中设置链接：

<div class="container">
    <div class="row">
        <div class="col-md-12">
            <h1>{{ controler.slug }}</h1>
            <p>This will be the sport homepage.</p>
            <p><a ui-sref="designer.team({ sport: controller.slug })">Click to get started</a></p>
        </div>
    </div>
</div>

就是这样。设计师，不一定是运动的孩子。

Angular和ui-router状态子

1 个答案: