errors
controllers.js:6 uncaught syntaxerror: unexpected token ( ionic.bundle.js:26794 error: [ng:areq] argument 'menuctrl' not function, got undefined i working create cross platform app of ionic framework using word press end, following files codes
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 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-platform-web-client/dist/ionic.io.bundle.min.js"></script> <!-- cordova script (this 404 during development) --> <!-- cordova bootstrapped ionic-platform-web-client, uncomment if remove ionic-platform-web-client... --> <!-- <script src="cordova.js"></script> --> <!-- app's js --> <script src="js/app.js"></script> <script src="js/controllers.js"></script> </head> <body ng-app="starter"> <ion-nav-view> </ion-nav-view> </body> </html> 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' angular.module('starter', ['ionic']) .run(function($ionicplatform) { $ionicplatform.ready(function() { if(window.cordova && window.cordova.plugins.keyboard) { // hide accessory bar default (remove show accessory bar above keyboard // form inputs) cordova.plugins.keyboard.hidekeyboardaccessorybar(true); // don't remove line unless know doing. stops viewport // snapping when text inputs focused. ionic handles internally // nicer keyboard experience. cordova.plugins.keyboard.disablescroll(true); } if(window.statusbar) { statusbar.styledefault(); } }); }) .config(function($stateprovider, $urlrouterprovider){ $stateprovider .state('main', { url: '/main', templateurl: 'templates/menu.html', controller: 'menuctrl' }) .state('main.contentrecent', { url: '/contentrecent', templateurl: 'templates/menucontent.html', controller: 'menuctrl' }) .state('main.postdetail', { url: '/postdetail', templateurl: 'templates/postdetail.html', controller: 'postctrl' }); $urlrouterprovider.otherwise('/main/contentrecent'); }) controllers.js
angular.module('starter') .controller( 'menuctrl', function ($http, $scope){ $scope.categories = []; $http.get("http://bijay.sahikura.com/api/get_category_index/").t function(data){ $scope.categories = data.data.categories; console.log(data); }, function ( err){ console.log(err); } }) .controller('postctrl', function() { //hello }) menu.html
<ion-side-menus> <ion-side-menu-content> <ion-nav-view> </ion-nav-view> </ion-side-menu-content> <ion-side-menu side="left"> <ion-header-bar class="bar-stable"> <h1 class="title"> खुला सरकार </h1> </ion-header-bar> <ion-content> <ion-list> <ion-item ng-repeat="category in categories" menu-close href ="#"> <span> {{category.title}} </span> <span class="badge badge-assertiv"> १</span> category.post_count}}</span> </ion-item> </ion-list> </ion-content> </ion-side-menu> </ion-side-menus>
it looks want reuse same controller within config define controller 'menuctrl' visible within html in app. in case better off defining function separately , reusing function name wherever need function. eg.
function menuctrlfunc(http, scope) { $scope.categories = []; // other stuff } angular.module('starter').controller('menuctrl', menuctrlfunc); angular.module('starter').config( //.... //.... controller: menuctrlfunc, ); hth
Comments
Post a Comment