I'm working on a mobile app using OnsenUI for the UI, running within the Monaca / Cordova framework, using Firebase as a BaaS through the angularfire module.
I've setup the module without Firebase as follows:
var myAppController = angular.module('myApp', ['onsen.directives']);
myAppController.controller('EventListCtrl', ['$scope', function($scope) {
However, as soon as I add Firebase as a module, the app stops working.
var myAppController = angular.module('myApp', ['onsen.directives', 'firebase']);
myAppController.controller('EventListCtrl', ['$scope', '$firebase', function($scope, $firebase) {
Can you please tell me what I'm doing wrong?
Thanks
According to this link, how about trying it this way:
var myAppController = angular.module('myApp', ['onsen.directives', 'firebase']);
myAppController.controller('EventListCtrl', function($scope, $firebase) {
Thought I should answer this myself to help anyone else facing the same situation.
My issue was that the firebase js script reference was wrong., ie. I was careless.
Regards
Related
I have Angular 1.4 service working in app.js but I want to move this service in a separate file. Can anybody advise me a site explaining how to do this? Thanks!
Heres an example of how you can move your service in a separate file.
app.js:
(function(){
// create main app module
angular.module('myApp', []);
})();
controller.js:
(function(){
angular.module('myApp').controller(MyController, MyController);
// inject dependencies here
MyController.$inject = ['MyService'];
function MyController(MyService) {
// controller logic
}
})();
service.js:
(function(){
angular.module('myApp').factory('MyService', MyService);
MyService.$inject = [];
function MyService() {
var service = {};
return service;
}
})();
As for a site with good explanations and best practices, check out the angular 1.x style guide which has been endorsed by the angular team. Specifically pay attention to Style Y001.
This is a general dependency injection question. Obviously I am doing it wrong.
I am trying to get angular-xeditable working in my app.
https://vitalets.github.io/angular-xeditable/
I've installed it using bower, and added the appropriate script link to my head.
Now I'm trying to inject it.
The docs say
var app = angular.module("app", ["xeditable"]);
so, in my app: I do this:
portalApp.controller('portalController',
['$scope', '$http','$filter', 'xeditable',
function($scope, $http, $filter, xeditable) {
but I get the provide error, meaning it can't find xeditable.
angular.js:13642Error: [$injector:unpr] http://errors.angularjs.org/1.5.6/$injector/unpr?p0=xeditableProvider%20%3C-%20xeditable%20%3C-%20portalController
What am I doing wrong?
OK, duh. It should be
var portalApp = angular.module("portalApp", ['xeditable']);
portalApp.controller('portalController', ['$scope', '$http','$filter', function($scope, $http, $filter) {
I'm still getting lots of errors, but at least not that one.
Just started using firebase v3 (released roughly two weeks ago) with angularfire v2 (which according to this post fully supports firebase v3). But I am struggling to simply retrieve some data into an angular view.
Here is the controller that simply returns user array and bind it to the view. It breaks on the line using $firebaseArray and says: TypeError: Object expected
I am using AngularJs 1.5.6. Just to show the versions of firebase and angularfire I am using:
<script src="https://cdn.firebase.com/libs/angularfire/2.0.1/angularfire.min.js"></script>
<script src="https://www.gstatic.com/firebasejs/live/3.0/firebase.js"></script>
(function() {
var app = angular.module("FirebaseTest");
var mainCtrl = function($scope, $firebaseArray) {
var root = firebase.database().ref();
var users = root.child('users');
console.log(users); // this works fine so no problem with firebase connection
//NOTE: this doesn't work and throws exception
$scope.users = $firebaseArray(users);
}
app.controller("mainCtrl", ["$scope", mainCtrl]);
})();
try this
app.controller("mainCtrl", ["$scope", '$firebaseArray', mainCtrl]);
This should work
According to LokiJS: in-memory NoSQL datastore for Cordova apps
I embedded loki-angular.js and then write the following script:
var onsen = angular.module('app', ['onsen', 'lokijs'])
.config(['$httpProvider', function($httpProvider) {
}]);
After that, I write a controller and then test on browser and get a error:
onsen.controller('ListController', ['$scope', 'Loki', function($scope, Loki) {
}]);
The error is:
ReferenceError: loki is not defined
at Object.Loki (.../loki-angular.js:29:16)
at Object.invoke (https://code.angularjs.org/1.2.12/angular.js:3710:17)
I just follow the guide from the post so I am not sure what's wrong and how to fix it.
Experts please help!
Ref: https://github.com/jvandemo/angular-growl-notifications
What will be the app.js file for Growl notifications ? I just need a simple notification as shown in the " Basic Example in the link below.
http://jvandemo.github.io/angular-growl-notifications/examples/index
Yes, we need one. Here is the Plunker.
http://plnkr.co/edit/ZZHW0JKumXfdFgjTjVJz?p=preview
var app = angular.module('plunker', ['growlNotifications']);
app.controller('MainCtrl', function($scope, $timeout) {
});