javascript - Ionic shows a blank page without any error -


i getting blank pages ionic. no errors show in chrome debugger. , when inspect debugger, saw nothing inside of ion-nav-view, means reason ui router not working. need in figuring out error.

here code:

index.html:

 <!doctype html> <html>   <head>     <meta charset="utf-8">     <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">     <title></title>      <link rel="manifest" href="manifest.json">      <!-- un-comment code enable service worker     <script>       if ('serviceworker' in navigator) {         navigator.serviceworker.register('service-worker.js')           .then(() => console.log('service worker installed'))           .catch(err => console.log('error', err));       }     </script>-->      <link href="lib/ionic/css/ionic.css" rel="stylesheet">     <link href="css/style.css" rel="stylesheet">      <!-- if using sass (run gulp sass first), uncomment below , remove css includes above     <link href="css/ionic.app.css" rel="stylesheet">     -->      <!-- ionic/angularjs js -->     <script src="lib/ionic/js/ionic.bundle.js"></script>     <script src="lib/ionic/js/angular/angular-resource.min.js"></script>     <script src="lib/ionic/js/angular-ui/angular-ui-router.min.js"></script>     <script src="lib/ngcordova/dist/ng-cordova.js"></script>      <!-- cordova script (this 404 during development) -->     <script src="cordova.js"></script>      <!-- app's js -->     <script src="js/app.js"></script>     <script src="js/services.js"></script>     <script src="js/controllers.js"></script>   </head>    <body ng-app="watchhoursapp">     <ion-nav-view>     </ion-nav-view>   </body> </html>

menu.html:

<ion-side-menus enable-menu-with-back-views="false">   <ion-side-menu-content>     <ion-nav-bar class="bar-stable">       <ion-nav-back-button>       </ion-nav-back-button>        <ion-nav-buttons side="left">         <button class="button button-icon button-clear ion-navicon" menu-toggle="left">         </button>       </ion-nav-buttons>     </ion-nav-bar>     <ion-nav-view name="menucontent"></ion-nav-view>   </ion-side-menu-content>    <ion-side-menu side="left">     <ion-header-bar class="bar-stable"  >       <h1 class="title">watchhours</h1>     </ion-header-bar>     <ion-content>       <ion-list>         <ion-item menu-close ui-sref="app">           home          </ion-item>         <ion-item menu-close ng-if="currentuser" ui-sref="app.user({id: uid})">           {{username}}         </ion-item>         <ion-item menu-close ui-sref="app.search">           tv shows         </ion-item>         <ion-item menu-close ng-if="!currentuser" ng-click="login()">           log in         </ion-item>         <ion-item menu-close ng-if="!currentuser" ng-click="register()">           sign         </ion-item>         <ion-item menu-close ng-if="currentuser" ng-click="logout()">           log out         </ion-item>       </ion-list>     </ion-content>   </ion-side-menu> </ion-side-menus>

app.js:

// ionic starter app  // angular.module global place creating, registering , retrieving angular modules // 'starter' name of angular module example (also set in <body> attribute in index.html) // 2nd parameter array of 'requires' // 'starter.controllers' found in controllers.js angular.module('watchhoursapp', ['ionic'])  .run(function($ionicplatform) {   $ionicplatform.ready(function() {     // hide accessory bar default (remove show accessory bar above keyboard     // form inputs)     if (window.cordova && window.cordova.plugins.keyboard) {       cordova.plugins.keyboard.hidekeyboardaccessorybar(true);       cordova.plugins.keyboard.disablescroll(true);      }     if (window.statusbar) {       // org.apache.cordova.statusbar required       statusbar.styledefault();     }   }); })  .config(function($stateprovider, $urlrouterprovider) {   $stateprovider     .state('app', {       url: '/app',       abstract: true,       templateurl: 'templates/menu.html',       controller: 'sidemenuctrl'   });   // if none of above states matched, use fallback   $urlrouterprovider.otherwise('/app'); });

controller.js:

angular.module('watchhoursapp')  .controller('sidemenuctrl', ['$scope', '$state', '$rootscope', 'shows', '$http',    '$location', '$localstorage', 'homeservices', 'authfactory',   '$ionicmodal', '$ionicsidemenudelegate', '$timeout',   function ($scope, $state, $rootscope, shows, $http,      $location, $localstorage, homeservices,     authfactory, $ionicmodal, $ionicsidemenudelegate, $timeout) {     console.log("hello");   // new view caching in ionic, controllers called   // when recreated or on app start, instead of every page change.   // listen when page active (for example, refresh data),   // listen $ionicview.enter event:   //$scope.$on('$ionicview.enter', function(e) {   //});     // form data login modal     $scope.logindata = $localstorage.getobject('userinfo','{}');     $scope.reservation = {};     $scope.registration = {};     $rootscope.currentuser = false;     $rootscope.username = '';     $rootscope.admin = false;     $rootscope.uid = '';     $rootscope.isverified = false;      if(authfactory.isauthenticated()) {       $rootscope.currentuser = true;       $rootscope.username = authfactory.getusername();       $rootscope.admin = authfactory.isadmin();       $rootscope.isverified = authfactory.isverified();       $rootscope.uid = authfactory.uid();     }      // create login modal use later     $ionicmodal.fromtemplateurl('templates/login.html', {         scope: $scope     }).then(function (modal) {         $scope.modal = modal;     });      // triggered in login modal close     $scope.closelogin = function () {         $scope.modal.hide();     };      // open login modal     $scope.login = function () {         $scope.modal.show();     };      // perform login action when user submits login form     $scope.dologin = function () {         console.log('doing login', $scope.logindata);         $localstorage.storeobject('userinfo',$scope.logindata);         authfactory.login($scope.logindata);         $scope.closelogin();     };      $scope.logout = function() {         authfactory.logout();         $rootscope.currentuser = false;         $rootscope.username = '';         $rootscope.admin = false;         $rootscope.isverified = false;         $rootscope.uid = '';         $state.go("app");     };      // on successful login     $rootscope.$on('login:successful', function () {         $rootscope.currentuser = authfactory.isauthenticated();         $rootscope.username = authfactory.getusername();         $rootscope.admin = authfactory.isadmin();         $rootscope.uid = authfactory.uid();         $rootscope.isverified = authfactory.isverified();     });      // create login modal use later     $ionicmodal.fromtemplateurl('templates/register.html', {         scope: $scope     }).then(function (modal) {         $scope.registerform = modal;     });      // triggered in login modal close     $scope.closeregister = function () {         $scope.registerform.hide();     };      // open login modal     $scope.register = function() {         $scope.registerform.show();     };      // perform login action when user submits login form     $scope.doregister = function() {         console.log('doing registration', $scope.registration);         $scope.logindata.username = $scope.registration.username;         $scope.logindata.password = $scope.registration.password;          authfactory.register($scope.registration);         // simulate login delay. remove , replace login         // code if using login system         $timeout(function () {             $scope.closeregister();         }, 1000);     };      // on successful registration     $rootscope.$on('registration:successful', function () {         $rootscope.currentuser = authfactory.isauthenticated();         $rootscope.username = authfactory.getusername();         $rootscope.admin = authfactory.isadmin();         $rootscope.uid = authfactory.uid();         $rootscope.isverified = authfactory.isverified();     });      $scope.toggleleft = function() {         $ionicsidemenudelegate.toggleleft();       }; }]);

you need inject ui-router module in angular app initialization.

angular.module('watchhoursapp', ['ionic','ui.router'])


Comments

Post a Comment

Popular posts from this blog

android - InAppBilling registering BroadcastReceiver in AndroidManifest -

i'm implementing inapp billing in android app. works well, however, i'm trying decouple broadcast receiver activity manifest. suggestion in android's trivialdrive sample: // important: dynamically register broadcast messages updated purchases. // register receiver here instead of <receiver> in manifest // because call getpurchases() @ startup, therefore can ignore // broadcasts sent while app isn't running. // note: registering listener in activity bad idea, done here // because sample. regardless, receiver must registered after // iabhelper setup, before first call getpurchases(). currently there's class extends broadcastreceiver : public class iabbroadcastreceiver extends broadcastreceiver { /** * intent action receiver should filter for. */ public static final string action = "com.android.vending.billing.purchases_updated"; private final iabbroadcastlistener mlistener; public iabbroadcastreceiver(iabbroadcastlistener listener) { m...
Read more

python Tkinter Capturing keyboard events save as one single string -

is possible store keyboard events 1 string? code below stores 1 char , prints it. card reader or bar code reader, contains collection of character/ string not 1 character @ time. goal save char pressed text variable. from tkinter import * root = tk() def key(event): text= event.char text+= event.char print ("pressed", text) def callback(event): frame.focus_set() print ("clicked at", event.x, event.y) frame = frame(root, width=100, height=100) frame.bind("<key>", key) frame.bind("<button-1>", callback) frame.pack() root.mainloop() currently, creating text variable , everytime key() function gets called, , text stores last character typed. you can define text module level variable , , use module level text inside key function - text = '' def key(event): global text text+= event.char print("pressed", text)
Read more

sql server - Why does Linq-to-SQL add unnecessary COUNT()? -

here tables: create table customer ( cid int primary key, name varchar(32) ) create table ord ( oid int primary key, cid int foreign key references customer, address varchar(20) ) here's linq-to-sql statement: var aaa = c in db.customer select new { c, o = c.ord.tolist() }; and here's inexplicable query generated linq-to-sql: select [t0].[cid] [cid], [t0].[name] [name], [t1].[oid] [oid], [t1].[cid] [cid2], [t1].[address] [address], (select count(*) [dbo].[ord] [t2] [t2].[cid] = [t0].[cid]) [value] [dbo].[customer] [t0] left outer join [dbo].[ord] [t1] on [t1].[cid] = [t0].[cid] order [t0].[cid], [t1].[oid] i want understand how rid of count(*) part. it's entirely uncalled for! linq needs count(*) in order determine number of entries returned o = c.ord.tolist() .
Read more