類型錯誤：無法讀取的溫泉UI未定義的屬性「setMainPage」，angularjs

我得到TypeError: Cannot read property 'setMainPage' of undefined錯誤，具有以下angularjsconfig和html，我不是understading因爲setMainPage在onsen-ui框架已經確定爲什麼它給這個錯誤，請幫助我，在此先感謝類型錯誤：無法讀取的溫泉UI未定義的屬性「setMainPage」，angularjs

錯誤：

TypeError: Cannot read property 'setMainPage' of undefined 
at Object.$stateProvider.state.state.onEnter (app.js:28) 
at Object.invoke (onsenui_all.min.js:3) 
at y.transitionTo.y.transition.M.then.y.transition.y.transition (angular-ui-router.min.js:7) 
at processQueue (onsenui_all.min.js:6) 
at onsenui_all.min.js:6 
at Scope.parent.$get.Scope.$eval (onsenui_all.min.js:8) 
at Scope.parent.$get.Scope.$digest (onsenui_all.min.js:8) 
at Scope.parent.$get.Scope.$apply (onsenui_all.min.js:8) 
at onsenui_all.min.js:2 
at Object.invoke (onsenui_all.min.js:3)

app.js（angularjs配置）

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

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

    // By default show Tab 1 - Navigator MasterDetail example 
    $urlRouterProvider.otherwise('/main'); 

    $stateProvider 

     // Tab 1 - SlidingMenu example - SlidingMenu init 
     .state('sliding', { 
      abstract: true, 
      // url: '/sliding', // Optional url prefix 
      resolve: { 
       loaded: function($rootScope) { 
        $rootScope.appTabbar.setActiveTab(1); 
        return $rootScope.appTabbar.loadPage('html/tab2.html'); 
       } 
      } 
     }) 

     // Tab 1 - SlidingMenu example - Landing page 
     .state('sliding.main', { 
      parent: 'sliding', 
      url: '/main', 
      onEnter: ['$rootScope', function($rootScope) { 
       $rootScope.appMenu.setMainPage('map.html', {closeMenu: true}); 
      }] 
     })   
    ; 
});

HTML：

<!DOCTYPE HTML> 
<html ng-app="itApp"> 
    <head> 
     <meta charset="utf-8"> 
     <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">  

     <script src="onsen/js/angular/angular.min.js"></script>  
     <script src="onsen/js/onsenui.min.js"></script> 
     <script src="onsen/js/angular/angular-ui-router.min.js"></script>  

     <link rel="stylesheet" href="onsen/css/onsenui.css"> 
     <link rel="stylesheet" href="onsen/css/onsen-css-components.css">  

     <script src="jsScripts/app.js"></script>   
     <script src="jsScripts/controllers.js"></script>      
    </head> 
    <body ng-controller="UserController"> 
     <ons-tabbar var="appTabbar" animation="none"> 
      <ons-tab ui-sref="navigator.master"> 
       <ons-icon icon="ion-home"></ons-icon> 
       <span style="font-size: 14px">MasterDetail</span> 
      </ons-tab> 
      <ons-tab ui-sref="sliding.main"> 
       <ons-icon icon="ion-star"></ons-icon> 
       <span style="font-size: 14px">SlidingMenu</span> 
      </ons-tab> 
     </ons-tabbar> 

     <ons-template id="html/tab1.html"> 
      <ons-sliding-menu menu-page="menu.jsp" side="left" var="appMenu" type="reveal" max-slide-distance="260px" swipeable="true"> 
      </ons-sliding-menu> 
     </ons-template> 

     <ons-template id="html/tab2.html"> 
      <ons-navigator title="Navigator" var="appNavigator"> 
      </ons-navigator> 
     </ons-template> 

    </body> 
</html>

來源

2015-10-06 Praveen Rawat

該錯誤不說，'setMainPage'沒有定義，但'appMenu'是不確定的，所以你不能從調用該變量的方法。 –

**因爲setMainPage已經在onsen-ui框架**中定義 - 顯然情況並非如此。可能是'appMenu'尚未在'config'生命週期中定義。檢查'onsen-ui'註冊'appMenu'的位置。這可能會在「運行」階段。 – Michael

我已經在 –

你大概已經在DOM被加載之前訪問appMenu元素。嘗試將所有app.config()代碼包裝在ons.ready()函數中。此函數在執行其內容之前等待所有DOM元素被加載。

例如：

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

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

 
    //content 
 
    
 
    }); 
 
});

來源

2015-10-06 16:03:58

Thnks @pavllo對於這個幫助..它真的對我很有幫助 –

@PraveenRawat歡迎您！ :) –

類型錯誤：無法讀取的溫泉UI未定義的屬性「setMainPage」，angularjs

回答

相關問題