离子功能“ion-nav-view”（ui-router）可以与ngRoute一起使用吗？

Question

我正在尝试将Angularfire-Seed 与样本Ionic App 合并。到目前为止，这工作得很好。

要浏览我的视图，我有兴趣使用离子功能：

// requires ui-router
<ion-nav-view></ion-nav-view> 

而不是

// requires ngRoute
<div ng-view></div>

问题在于 ion-nav-view (Ionic) 是 ui-router (see here explanation) 的一部分，而 ng-view 是 ngRoute (Angularfire-seed) 的一部分。

因此有没有办法继续使用ngRoute（因为在Angularfire-Seed项目中已经完成了很多编码，因此我不想切换到ui-router），但仍然使用ion-nav-view？

跟进：有人用 Ionic（以及 ui-router）实现了 AngularFire 吗？可用的 git？

Answer 1

不，ion-nav-view 在后台使用 ui-router。除非您想编写自己的实现，否则您不能使用 ngRoute。

编辑

要回答有关在 Ionic 中使用链接文件的问题，您必须将其重构为使用 ui-router。在此处查看UI Router Guide 和此处的Ionic docs。非常值得阅读第一个链接以深入了解。

依赖关系

ui-router 包含在 Ionic 包中，因此您无需将其明确声明为依赖项。

因此，前提是您已经将 Ionic 作为依赖项，而不是

angular.module('myApp.routes', ['ngRoute', 'simpleLogin'])

你可以拥有

angular.module('myApp.routes', ['simpleLogin'])

.config 块

我没有使用过ngRoute，但$stateProvider 和ui-router 之间的语法看起来很相似。对于ngRoute，您使用$routeProvider 就像这样......

.config(function($routeProvider, $locationProvider) {
  $routeProvider
   .when('/chat', {
    templateUrl: 'partials/chat.html',
    controller: 'ChatCtrl',
  })

使用ui-router 配置“状态”类似于以下内容（最后使用$urlRouterProvider.otherwise() 会捕获尚未明确定义的任何URL 并重定向到您指定的任何URL）

.config(function($stateProvider, $urlRouterProvider){

  $stateProvider

    .state('home', {
      url: '/',
      templateUrl: "partials/home.html",
      controller: 'HomeCtrl',
      resolve: {
        // resolve stuff in here, check the docs for implementation differences
      }
    })

    .state('chat', {
      url: '/chat',
      templateUrl: "partials/chat.html",
      controller: 'ChatCtrl',
      }
    })

  $urlRouterProvider.otherwise('/');

身份验证在您的链接文件中处理，此链接可能对angular ui-router login authentication 有所帮助。祝你好运！