angular.service(‘myService’, myServiceFunction); angular.factory(‘myFactory’, myFactoryFunction); I had trouble wrapping my head around this concept until I put it to myself this way: Service: the function that you write will be new-ed: myInjectedService <—- new myServiceFunction() Factory: the function (constructor) that you write will be invoked: myInjectedFactory <— myFactoryFunction() What you do with that is up to … Read more
So basically as mentioned by Cherniv we need to bootstrap the modules to have multiple ng-app within the same page. Many thanks for all the inputs. var shoppingCartModule = angular.module(“shoppingCart”, []) shoppingCartModule.controller(“ShoppingCartController”, function($scope) { $scope.items = [{ product_name: “Product 1”, price: 50 }, { product_name: “Product 2”, price: 20 }, { product_name: “Product 3”, price: … Read more
From the angular docs Server side Using this mode requires URL rewriting on server side, basically you have to rewrite all your links to entry point of your application (e.g. index.html) The reason for this is that when you first visit the page (/about), e.g. after a refresh, the browser has no way of knowing … Read more
Yes, you should configure $locationProvider and set html5Mode to true: angular.module(‘phonecat’, []). config([‘$routeProvider’, ‘$locationProvider’, function($routeProvider, $locationProvider) { $routeProvider. when(‘/phones’, {templateUrl: ‘partials/phone-list.html’, controller: PhoneListCtrl}). when(‘/phones/:phoneId’, {templateUrl: ‘partials/phone-detail.html’, controller: PhoneDetailCtrl}). otherwise({redirectTo: ‘/phones’}); $locationProvider.html5Mode(true); }]);
The empty option is generated when a value referenced by ng-model doesn’t exist in a set of options passed to ng-options. This happens to prevent accidental model selection: AngularJS can see that the initial model is either undefined or not in the set of options and don’t want to decide model value on its own. … Read more
How to set focus on input field?
From a recent discussion with the Angular guys on this very topic: For future-proofing reasons, you should not use $$phase When pressed for the “right” way to do it, the answer is currently $timeout(function() { // anything you want can go here and will safely be run on the next digest. }) I recently ran … Read more
That little dot is very important when dealing with the complexities of scope inheritance. The egghead.io video “The Dot” has a really good overview, as does this very popular stack overflow question: What are the nuances of scope prototypal / prototypical inheritance in AngularJS? I’ll try to summarize it here: Angular.js uses scope inheriting to … Read more
You need to be aware about how AngularJS works in order to understand it. Digest cycle and $scope First and foremost, AngularJS defines a concept of a so-called digest cycle. This cycle can be considered as a loop, during which AngularJS checks if there are any changes to all the variables watched by all the … Read more
Why do I have to use “{{title}}” with ‘@‘ and “title” with ‘=‘? @ binds a local/directive scope property to the evaluated value of the DOM attribute. If you use title=title1 or title=”title1″, the value of DOM attribute “title” is simply the string title1. If you use title=”{{title}}”, the value of the DOM attribute “title” … Read more