Question

我在我的网络应用程序中使用Angular-Meteor解决方案，我选择使用angular-ui：router over iron-router。当我决定使用休斯顿管理员时，我遇到了问题。有没有办法将铁路由器限制为/ admin / *路由？

当我正常浏览我的应用程序时，我从视图中的铁路由器收到一条消息，说该路由不存在，但它在angular-ui：rouer下。

编辑：定义铁路由器内的路由让我到了某处，但现在我的angular-ui视图正在显示两次。

//Iron-Router
Router.route('/(.*)', function (){});

//UI-Router
angular.module("test").config(
function($urlRouterProvider, $stateProvider, $locationProvider){

$locationProvider.html5Mode(true);

$stateProvider
  .state('main', {
    url: '/',
    templateUrl: 'client/app/main/views/main.ng.html',
    controller: 'MainCtrl'
  })
  .state('profile',{
    url: '/profile/:user_id',
    templateUrl: 'client/app/main/views/profile.ng.html',
    controller: 'ProfileCtrl',
    resolve: {
      currentUser: function($meteor){
        return $meteor.requireUser();
      }
    }
  });

$urlRouterProvider.otherwise("/");

}）;

EDIT2：当页面刷新时，它不会双重显示视图。这是在我通过ui-router更改路由后发生的。我以为我可能需要给铁路由器提供像空标签一样的东西。

解决方案：请参阅下面的答案，有关编码示例，请在此处查看github https://github.com/cleor41/router-example。

Answer 1

编辑：如果有人想查看示例，请查看此处的链接https://github.com/cleor41/router-example

而不是试图回避铁路由器，我不得不使用它，至少对于初始页面加载。我的初始index.html已经改变了。

<head>
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <base href="/">
  <title>test</title>
</head>

<body>
  <navbar></navbar>
  <div ui-view></div>
</body>

到这个

<head>
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <base href="/">
  <title>test</title>
</head>

<body>
</body>

我创建了一个封装正文的模板。

<template name="default">
  <navbar></navbar>
  <div ui-view></div>
</template>

最后但并非最不重要的是，我不得不改变我的铁路。

Router.route('/(.*)', function(){
  this.render('default');
});

这可行，因为铁路由器只会渲染一次模板然后ui路由器才会启动。我的视图不会显示两次，我可以使用休斯顿管理员，两个路由器玩得很好。

注意：应该注意的是，如果你想在ui路由器旁边使用Houston Admin，ui路由器需要捕获所有的admin / *路由，然后在$ stateChangeStart中捕获event.preventDefault（）。这种方式＆＃34; urlRouterProvider.otherwise（＆＃34; /＆＃34;）＆＃34;当你在Meteor方面做事时，不会弄乱地址栏。

Answer 2

如果您希望在一个路由器中处理路由但不在另一个路由器中处理（无关紧要），您应该将该路由添加到两个路由中进行处理，但是其中一个路由不执行任何操作它被处理了。

你必须这样做，以便不会发生该路由的默认行为（通常是重定向到某个地方）。

如果这个答案没有帮助，请复制/粘贴您的路线，以便我更好地了解正在发生的事情。

Answer 3

NOTE：事实上。您不需要定义模板名称=“索引”/模板。你只需要定义 Router.route（'/'，function（）{

}）; （在route.ng.js的顶层）

无需在Router.route中呈现任何内容，而且index.html应该是原样。并在ui-router中定义对应的状态： .STATE（ 'ADMIN1'，{ 网址：'/ admin' }） .STATE（ '的admin2'，{ url：'/ admin / * path' }）;

然后一切都会好起来的。这就是我做到的。

Iron Router与Angular-UI路由器冲突

3 个答案: