Angularjs module error -
i new angularjs, trying make app use camera , save images in firebase. following 1 tutorial , getting error. tried fix didn't work out. pls guys.
i posted code on github. https://github.com/brunocoder/imageapp
uncaught error: [$injector:modulerr] failed instantiate module myapp due to: error: [$injector:nomod] module 'myapp' not available! either misspelled module name or forgot load it. if registering module ensure specify dependencies second argument.
this 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"> <script src="angular.min.js"></script> <script src="js/angular-route.min.js"></script> <script src="lib/ionic/js/ionic.bundle.js"></script> <script src="js/ng-cordova.min.js"></script> <script src="cordova.js"></script> <script src="js/firebase.js"></script> <script src="js/angularfire.min.js"></script> <script src="js/app.js"></script> </head> <body ng-app="myapp"> <ion-pane> <ion-nav-bar class="bar-stable"> <ion-nav-back-button> </ion-nav-back-button> </ion-nav-bar> <ion-nav-view></ion-nav-view> </ion-pane> </body> </html>
app.js
'use strict'; var imageapp = angular.module("myapp", ['ionic', 'ngcordova', 'ngroute', 'firebase']); var fb = new firebase("myfirebaseaccountid"); imageapp.run(function($ionicplatform) { $ionicplatform.ready(function() { if(window.cordova && window.cordova.plugins.keyboard) { cordova.plugins.keyboard.hidekeyboardaccessorybar(true); } if(window.statusbar) { statusbar.styledefault(); } }); }); imageapp.config(function($stateprovider, $urlrouterprovider){ $stateprovider .state("firebase",{ url : "/firebase", templateurl : "templates/firebase.html", controller : "firebasecontroller", cache : false }) .state("secure",{ url : "/secure", templateurl : "templates/secure.html", controller : "securecontroller", }); $urlrouterprovider.otherwise("/firebase"); }); imageapp.controller("firebasecontroller", function($scope, $state, $firebaseauth){ var fbauth = $firebaseauth(fb); $scope.login = function(username, password){ fbauth.$authwithpassword({ email : username, password : password }).then(function(authdata){ $state.go("secure"); }).catch(function(error){ console.error("error : "+error); }); } $scope.register = function(username, password){ fbauth.$createuser({email:username, password:password}).then(function(userdata){ return fbauth.$authwithpassword({ email:username, password: password }); }).then(function(authdata){ $state.go("secure"); }).catch(function(error){ console.log("error : " +error); }); } }); imageapp.controller("securecontroller", function($scope, $ionichistory, $firebasearray, $cordovacamera){ $ionichistory.clearhistory(); $scope.images= []; var fbauth = fb.getauth(); if fbauth(){ var userreference = fb.child("users/" + fbauth.uid); var syncarray = $firebasearray(userreference.child("images")); $scope.images = syncarray; }else { $state.go("firebase") } $scope.upload = function(){ var option = { quality : 75, destinationtype : camera.destinationtype.data_url, sourcetype : camera.picturesourcetype.camera, allowedit : true, encodingtype : camera.encodingtype.jpeg, popoveroptions : camerapopoveroptions, targetwidth : 500, targetheight : 500, savetophotoalbum : false, } $cordovacamera.getpicture(options).then(function(imagedata){ syncarray.$add({image:imagedata}).then(function(){ alert("the image saved."); }); }, function(error){ console.error( "error: " + error); }); } });
firebase.html
<ion-view title="firebase"> <ion-content> <div class=""> <div class="list list-inset"> <label class="item item-input"> <input ng-model="username" type="text" placeholder="username"> </label> <label class="item item-input"> <input ng-model="password" type="text" placeholder="password"> </label> </div> <div class="padding-left padding-right"> <div class="button-bar"> <a class="button" ng-click="login(username, passowrd)">login</a> <a class="button" ng-click="register(username, passowrd)">register </a> </div> </div> </div> </ion-content> </ion-view>
secure.html
<ion-nav-buttons side="right"> <button class="button button-icon icon ion-camera" ng-click="upload()">camera</button> </ion-nav-buttons> <ion-content> <div class="row" ng-repeat="image in images" ng-if="$index % 4 === 0"> <div class="col col-25" ng-if="$index < images.length"> <img ng-src="data:image/jpeg;base64,{{images[$index].image}}" width = "100%" /> </div> <div class="col col-25" ng-if="$index + 1 < images.length"> <img ng-src="data:image/jpeg;base64,{{images[$index + 1].image}}" width = "100%" /> </div> <div class="col col-25" ng-if="$index + 2 < images.length"> <img ng-src="data:image/jpeg;base64,{{images[$index + 2].image}}" width = "100%" /> </div> <div class="col col-25" ng-if="$index + 3 < images.length"> <img ng-src="data:image/jpeg;base64,{{images[$index + 3].image}}" width = "100%" /> </div> </div> </ion-content> </ion-view>
this error getting
failed instantiate module myapp due to: error: [$injector:nomod] module 'myapp' not available! either misspelled module name or forgot load it. if registering module ensure specify dependencies second argument. http://errors.angularjs.org/1.4.3/$injector/nomod?p0=myapp @ file:///android_asset/www/lib/ionic/js/ionic.bundle.js:13380:12 @ file:///android_asset/www/lib/ionic/js/ionic.bundle.js:15270:17 @ ensure (file:///android_asset/www/lib/ionic/js/ionic.bundle.js:15194:38) @ module (file:///android_asset/www/lib/ionic/js/ionic.bundle.js:15268:14) @ file:///android_asset/www/lib/ionic/js/ionic.bundle.js:17674:22 @ foreach (file:///android_asset/www/lib/ionic/js/ionic.bundle.js:13648:20) @ loadmodules (file:///android_asset/www/lib/ionic/js/ionic.bundle.js:17658:5) @ createinjector (file:///android_asset/www/lib/ionic/js/ionic.bundle.js:17584:11) @ dobootstrap (file:///android_asset/www/lib/ionic/js/ionic.bundle.js:14942:20) @ bootstrap (file:///android_asset/www/lib/ionic/js/ionic.bundle.js:14963:12)
thanks
you've got ionic bundle specified includes angular default. remove reference angular, angular-route , few others , should go!
Comments
Post a Comment