Question

我正在构建一个具有不同模块的应用程序。两个模块可以有相同的页面。所以基于url我正在进行适当的ajax调用来加载数据。所以我想以下面的方式设置我的状态：

$stateProvider.state('login', {
    url: '/login',
    templateUrl: 'login.html',
    controller: 'LoginController as LoginController'
}).state('logout', {
    url: '/logout',
    templateUrl: '',
    controller: 'LogoutController as LogoutController'
}).state('module', {
    url: '/:module',
    params: {
        module: DataService.getCurrentModule()
    }
}).state('module.cover', {
    url: '/cover',
    templateUrl: 'cover.html',
    params: {
        module: 'leads'
    }
}).state('module.leads', {
    url: '/leads',
    templateUrl: 'leads.html',
    controller: 'LeadsController as ctrl',
    abstract: true
})

鉴于在登录时我将获取所有模块并将其保存在正在发生的DataService中。登录后，将完成两件事。我用以下方式格式化的一个导航网址：

<a href={'#/'+ module.code +"/" + (menu.type|| menu)}>
    <i className={classes}></i> <span >{menu.name || menu }</span>
</a>

正在设置正确的网址，第二个在app.js中设置＆＃34;运行＆＃34;我正在检查登录是否已完成我正在做的事情： $ location.path（DataService.getCurrentModule（）+＆＃34; /＆＃34; +（home.type || home））;

这也正在发生，但问题是所需的控制器和html页面没有被加载。我在这里错过了一些东西。或者我应该做些不同的事情？

提前感谢您的帮助。

Answer 1

使用href时请避免使用ui.router。要导航到所需的状态，请使用：

在HTML中：ui-sref="myStateName({param1: 1, param2: 2})"
在Javascript中注入服务$state并执行：$state.go('myStateName', {param1: 1, param2: 2});

在您的情况下，假设$ scope中的数组中有2个模块：

$scope.myModules = [{code: 'modA'},{code: 'modB'}];

现在在HTML中，转到module.cover状态，你会这样做：

<a ui-sref="module.cover({module: myModules[0].code})">My Link</a>

如果要对所有模块执行此操作，请将其放在ng-repeat：

中

<a ng-repeat="mod in modules" ui-sref="module.cover({module: mod.code})">My Link</a>

此外，对于状态配置，请考虑：

所有状态需要模板：即使它们是抽象状态，它们也需要模板才能正常工作。如果父状态没有模板，即使其中一个孩子也不会显示。在这种情况下，状态module没有模板，因此它永远不会起作用。为其定义模板就像template: '<div ui-view></div>'
在URL中定义参数时，无需再使用params属性进行定义。仅在您需要不希望在URL

在ui路由中参数化的第一级状态

1 个答案: