Tutorial by Examples: angular

The function angular.isFunction determines and returns true if and only if the value passed to is a reference to a function. The function returns a reference to the now extended destination object angular.isFunction(fn) Examples var onClick = function(e) {return e}; angular.isFunction(onCli...
The function angular.toJson will take an object and serialize it into a JSON formatted string. Unlike the native function JSON.stringify, This function will remove all properties beginning with $$ (as angular usually prefixes internal properties with $$) angular.toJson(object) As data needs to ...
The function angular.fromJson will deserialize a valid JSON string and return an Object or an Array. angular.fromJson(string|object) Note that this function is not limited to only strings, it will output a representation of any object passed to it. Examples: angular.fromJson("{\"yo...
// thecontroller.js $scope.sendVerifyEmail = function() { console.log('Email sent, whaaaaam!'); currentAuth.sendEmailVerification(); } // where currentAuth came from something like this: // routerconfig .... templateUrl: 'bla.html', resolve: { currentAuth:['Auth', functio...
As defined in the AngularJS Documentation When a Controller is attached to the DOM via the ng-controller directive, Angular will instantiate a new Controller object, using the specified Controller's constructor function. A new child scope will be created and made available as an injectable par...
The angular.noop is a function that performs no operations, you pass angular.noop when you need to provide a function argument that will do nothing. angular.noop() A common use for angular.noop can be to provide an empty callback to a function that will otherwise throw an error when something ...
The angular.isObject return true if and only if the argument passed to it is an object, this function will also return true for an Array and will return false for null even though typeof null is object . angular.isObject(value) This function is useful for type checking when you need a defined ...
The angular.isElement returns true if the argument passed to it is a DOM Element or a jQuery wrapped Element. angular.isElement(elem) This function is useful to type check if a passed argument is an element before being processed as such. Examples: angular.isElement(document.querySelector(&q...
The angular.copy function takes an object, array or a value and creates a deep copy of it. angular.copy() Example: Objects: let obj = {name: "vespa", occupation: "princess"}; let cpy = angular.copy(obj); cpy.name = "yogurt" // obj = {name: "vespa", ...
Step 1: Create a new Rails app gem install rails -v 4.1 rails new angular_example Step 2: Remove Turbolinks Removing turbolinks requires removing it from the Gemfile. gem 'turbolinks' Remove the require from app/assets/javascripts/application.js: //= require turbolinks Step 3: Add Angu...
$q is a built-in service which helps in executing asynchronous functions and using their return values(or exception) when they are finished with processing. $q is integrated with the $rootScope.Scope model observation mechanism, which means faster propagation of resolution or rejection into your m...
The angular.identity function returns the first argument passed to it. angular.identity(argument) This function is useful for functional programming, you can provide this function as a default in case an expected function was not passed. Examples: angular.identity(42) // 42 var mutate = f...
The angular.forEach accepts an object and an iterator function. It then runs the iterator function over each enumerable property/value of the object. This function also works on arrays. Like the JS version of Array.prototype.forEach The function does not iterate over inherited properties (prototype...
Using D3js with Angular can open up new fronts of possibilities such as live updation of charts as soon as data is updated. We can encapsulate complete chart functionality within an Angular directive, which makes it easily reusable. index.html >> <!DOCTYPE html> <html ng-app="...
import { Component } from '@angular/core'; import { Router , ROUTER_DIRECTIVES} from '@angular/router'; import { NgForm } from '@angular/forms'; @Component({ selector: 'login', template: ` <h2>Login</h2> <form #f="ngForm" (ngSubmit)="login(f.value,f....
Sometimes you need to fetch data asynchronously before passing it to a child component to use. If the child component tries to use the data before it has been received, it will throw an error. You can use ngOnChanges to detect changes in a components' @Inputs and wait until they are defined before a...
creating-listview.component.html <ListView [items]="countries" (itemTap)="onItemTap($event)"> <template let-country="item" let-i="index"> <StackLayout orientation="horizontal"> <Label [text]='(i + 1) +...
ngfor.component.html <StackLayout> <Label *ngFor="let item of items" [text]="item"></Label> </StackLayout> ngfor.component.ts import { Component } from "@angular/core"; var dataItems = ["data-item 1", "data-item 2&quo...
app.ts import {Component} from '@angular/core'; import {Platform, ionicBootstrap} from 'ionic-angular'; import {StatusBar} from 'ionic-native'; import {LoginPage} from './pages/login/login'; import {FIREBASE_PROVIDERS, defaultFirebase, AuthMethods, AuthProviders, firebaseAuthConfig} from 'angul...
For live demo click.. App index ts import {bootstrap} from '@angular/platform-browser-dynamic'; import {MyForm} from './my-form.component.ts'; bootstrap(MyForm); Custom validator import {Control} from @'angular/common'; export class CustomValidators { static emailFormat(control: Cont...

Page 2 of 6