侧边菜单运行，但路由文件什么也不显示答案

【问题标题】：Side menu runs but routes file shows nothing侧边菜单运行，但路由文件什么也不显示
【发布时间】：2016-06-26 05:19:53
【问题描述】：

我正在尝试使用聊天事件和设置选项卡制作一个简单的侧面菜单。如果我从路由 js 文件中删除设置和事件块，它就会运行，但什么也不显示。片段如下，如果需要，这里是整个流星文件夹的链接，可以在您的 comp 上运行 - https://drive.google.com/folderview?id=0B2MX6dSPUGBMTnMtWVVqLVcwNDQ&usp=sharing

我不断收到这样的错误消息：

=> Meteor 服务器重启启动了您的应用程序。应用程序运行于：http://localhost:3000/ 错误阻止启动：使用 pbastowski:angular-babel 处理文件时（针对目标 web.browser）： client/scripts/routes.js:20:4: Babel 转换错误您的应用程序有错误。等待文件更改。

routes.js 和 settings.html 分别

angular
  .module('myapp')
  .config(config);
 
function config($stateProvider, $urlRouterProvider) {
  $stateProvider
    .state('tab', {
      url: '/tab',
      abstract: true,
      templateUrl: 'client/templates/tabs.html'
    })
    .state('tab.chats', {
      url: '/chats',
      views: {
        'tab-chats': {
          templateUrl: 'client/templates/chats.html'
        }
      }
    });
    .state('tab.events', {
      url: '/events',
      views: {
        'tab-events': {
          templateUrl: 'client/templates/events.html'
        }
      }
    });

    .state('tab.settings', {
      url: '/settings',
      views: {
        'tab-settings': {
          templateUrl: 'client/templates/settings.html'
        }
      }
    });


 
  //$urlRouterProvider.otherwise('tab/recents');
}

<!-- settings.html, events.html, chats.html are all pretty much the same -->

<ion-view view-title="Settings">
  <ion-content>
 
  </ion-content>
</ion-view>

menu.html

<ion-side-menus>

  <ion-side-menu-content>
    <ion-nav-bar class="bar-stable nav-title-slide-ios7">
      <ion-nav-back-button class="button-clear"><i class="icon ion-ios7-arrow-back"></i> Back</ion-nav-back-button>
    </ion-nav-bar>
    <ion-nav-view name="menuContent" animation="slide-left-right"></ion-nav-view>
  </ion-side-menu-content>

  <ion-side-menu side="left">
    <header class="bar bar-header bar-royal">
      <h1 class="title">Left</h1>
    </header>
    <ion-content class="has-header">
      <ion-list>
        <ion-item menu-close title="Chats" href="#/app/chats">
          Chats
        </ion-item>
        <ion-item menu-close title="Events" href="#/app/events">
          Events
        </ion-item>
        <ion-item menu-close title="Settings" href="#/app/settings">
          Settings
        </ion-item>
      </ion-list>
    </ion-content>
  </ion-side-menu>

</ion-side-menus>

【问题讨论】：

标签： javascript angularjs meteor ionic-framework sidebar

【解决方案1】：

看起来你那里有一些不应该在那里的分号。对 state 的调用必须是嵌套的，所以不要以分号结束它们，除非它是你的最后一个。更新代码：

angular
  .module('myapp')
  .config(config);

function config($stateProvider, $urlRouterProvider) {
  $stateProvider
    .state('tab', {
      url: '/tab',
      abstract: true,
      templateUrl: 'client/templates/tabs.html'
    })
    .state('tab.chats', {
      url: '/chats',
      views: {
        'tab-chats': {
          templateUrl: 'client/templates/chats.html'
        }
      }
    })
    .state('tab.events', {
      url: '/events',
      views: {
        'tab-events': {
          templateUrl: 'client/templates/events.html'
        }
      }
    })

    .state('tab.settings', {
      url: '/settings',
      views: {
        'tab-settings': {
          templateUrl: 'client/templates/settings.html'
        }
      }
    });



  //$urlRouterProvider.otherwise('tab/recents');
}

【讨论】：