Consider some pros and cons of the second approach: 0 {{lastUpdated}} instead of {{timerData.lastUpdated}}, which could just as easily be {{timer.lastUpdated}}, which I might argue is more readable (but let’s not argue… I’m giving this point a neutral rating so you decide for yourself) +1 It may be convenient that the controller acts as a … Read more
You should use promises for async operations where you don’t know when it will be completed. A promise “represents an operation that hasn’t completed yet, but is expected in the future.” (https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Promise) An example implementation would be like: myApp.factory(‘myService’, function($http) { var getData = function() { // Angular $http() and then() both return promises themselves … Read more
This creates a new module/app: var myApp = angular.module(‘myApp’,[]); While this accesses an already created module (notice the omission of the second argument): var myApp = angular.module(‘myApp’); Since you use the first approach on both scripts you are basically overriding the module you previously created. On the second script being loaded, use var myApp = … Read more
The way to define common code in angular is through Services. You would define a new service like so : .factory(‘CommonCode’, function ($window) { var root = {}; root.show = function(msg){ $window.alert(msg); }; return root; }); In your controller you would inject this service..like so function MainAppCtrl($scope,CommonCode) { $scope.alerter = CommonCode; $scope.alerter.show(“Hello World”); } Just … Read more
Manually bootstrap your Angular app: Remove your ng-app attribute from your HTML code, so Angular doesn’t start itself. Add something like this to you JavaScript code: document.addEventListener(“deviceready”, function() { // retrieve the DOM element that had the ng-app attribute var domElement = document.getElementById(…) / document.querySelector(…); angular.bootstrap(domElement, [“angularAppName”]); }, false); Angular documentation for bootstrapping apps.
Explanation You got different things here: First: If you use a service you will get the instance of a function (“this” keyword). If you use a factory you will get the value that is returned by invoking the function reference (the return statement in factory). ref: angular.service vs angular.factory Second: Keep in mind all providers … Read more
I’m a little late to the thread, but if you’re using Grunt I’ve had great success with grunt-ng-constant. The config section for ngconstant in my Gruntfile.js looks like ngconstant: { options: { name: ‘config’, wrap: ‘”use strict”;\n\n{%= __ngModule %}’, space: ‘ ‘ }, development: { options: { dest: ‘<%= yeoman.app %>/scripts/config.js’ }, constants: { ENV: … Read more
Service vs Factory The difference between factory and service is just like the difference between a function and an object Factory Provider Gives us the function’s return value ie. You just create an object, add properties to it, then return that same object.When you pass this service into your controller, those properties on the object … Read more
You can inject mocks into your service by using $provide. If you have the following service with a dependency that has a method called getSomething: angular.module(‘myModule’, []) .factory(‘myService’, function (myDependency) { return { useDependency: function () { return myDependency.getSomething(); } }; }); You can inject a mock version of myDependency as follows: describe(‘Service: myService’, function … Read more
After AngularJS version 1.3 global controller function declaration is disabled You need to first create an AngularJS module & then attach all the components to that specific module. CODE function Ctrl($scope) { $scope.age = 24; } angular.module(‘app’, []) .controller(‘Ctrl’, [‘$scope’, Ctrl]); Specifically for your case, there is some issue with AngularJS 1.3.14 (downgrade it to … Read more