如何通過Angular UI路由器在ons-navigator中設置ons-sliding-menu？

我想通過angular ui-router在ons-navigator中加載ons-sliding-menu，但它不起作用。請看看我的下面的代碼，我在哪裏做錯了，爲什麼發生這種情況，既沒有顯示控制檯的任何錯誤，也沒有顯示它的工作。你的幫助將非常感激。如何通過Angular UI路由器在ons-navigator中設置ons-sliding-menu？

角： -

var app = angular.module('myApp', ['onsen', 'ui.router']); 

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

    $urlRouterProvider.otherwise('/slider'); 

    $stateProvider  
     .state('navigator', { 
      abstract: true, 
      url: '/navigator' 
     }) 
     .state('navigator.slider', { 
      parent: 'navigator', 
      url: '/slider', 
      onEnter: ['$rootScope', function($rootScope) { 
       $rootScope.myNavigator.resetToPage('html/slider.html'); 
      }] 
     }) 
    ; 

});

HTML： -

<body ng-app="myApp"> 
    <ons-navigator title="Navigator" var="myNavigator"></ons-navigator> 

    <ons-template id="html/slider.html"> 
     <ons-sliding-menu menu-page="html/menu.html" 
          side="left" 
          main-page="html/main.html" 
          var="myMenu" type="reveal" 
          max-slide-distance="260px" 
          swipeable="true"> 
     </ons-sliding-menu> 
    </ons-template> 
</body>

來源

2015-10-16 Praveen Rawat

看起來UI路由器不能正常工作，如果在index.html沒有ui-sref。添加下一個愚蠢的div到你的index.html使它工作。

<div style="height: 0; width: 0" ui-sref="navigator"></div>

只要它存在，它指向的狀態無關緊要。說實話，我不知道原因，但是它可以解決這個問題。

順便說一句，添加一個ons-page包裝ons-sliding-menu或導航器會對你大喊。

希望它有幫助！

來源

2015-10-21 14:03:33

如何通過Angular UI路由器在ons-navigator中設置ons-sliding-menu？

回答

相關問題