NG-Book-Part-2

Question 1

Two-Way Data Binding

Answer 1

Allows us to bind the value of a property inside the private scope of our directive to the value of an attribute available within the DOM.

Question 2

Transclude

Answer 2

Transclude is optional. If provided, it must be set to true. Often used to create reusable widgets like modal box or navbar.

Question 3

Compile Phase

Answer 3

During the compile phase, Angular slurps up our initial HTML page and begins processing the directives we declared according to the directive definitions we’ve defined within our application’s JavaScript.

Question 4

Run Blocks

Answer 4

Run blocks are executed after the injector is created and are the first methods that are executed in any Angular app. Run blocks are the closest thing in Angular to the main method.

Typically, these run blocks are places where we’ll set up event listeners that should happen at the global scale of the app.

Question 5

$routeProvider

Answer 5

Using the $routeProvider, we can take advantage of the browser’s history navigation and enable users to bookmark and share specific pages, as it uses the current URL location in the browser.

angular.module(‘myApp’, [‘ngRoute’]);

Question 6

ng-view

Answer 6

is a special directive that’s included with the ngRoute module. Its specific responsibility is to stand as a placeholder for $route view content.

Question 7

What 2 methods are used to declare routes?

Answer 7

the when method and the otherwise method.

The when method takes two parameters (when(path, route)).

Question 8

Route Example

Answer 8

angular.module('myApp', [])
  config(['$routeProvider', 
    function($routeProvider) { 
      $routeProvider
        .when('/', { 
          templateUrl: 'views/home.html',
          controller: 'HomeController'
     }); 
}]);

Question 9

$Location Service

Answer 9

AngularJS provides a service that parses the URL in the address bar and gives you access to the route of the current path of your applications.

It provides a nicer interface to the window.location JavaScript object and integrates directly with our AngularJS apps.

We’ll use whenever we need to provide a redirect internal to our app, such as redirecting after a user signs up, changes settings, or logs in.

Question 10

replace()

Answer 10

If you want to redirect completely without giving the user the ability to return using the back button (it’s useful for times when a redirect occurs after they are redirected, for instance a redirect after login).

Question 11

Routing Modes

Answer 11

refers specifically to the format of the URL in the browser address bar.

Question 12

Hashbang Mode

Answer 12

http://yoursite.com/#!/inbox/all

Question 13

HTML5 Mode

Answer 13

This mode makes your URLs look like regular URLs.

http://yoursite.com/inbox/all

Question 14

Dependency Injection

Answer 14

is a design pattern that allows for the removal of hard-coded dependencies, thus making it possible to remove or change them at run time.

This ability to modify dependencies at run time allows us to create isolated environments that are ideal for testing.

Question 15

ngMin

Answer 15

tool that allows us to alleviate the responsibility to define our dependencies explicitly.It walks through our Angular apps and sets up dependency injection for us.

Installation
$ npm install -g ngmin

Using
$ ngmin input.js output.js

If we’re using Grunt, we can install the grunt-ngmin Grunt task. If we are using Rails, we can use the Ruby gem ngmin-rails.

Question 16

Services

Answer 16

Are singleton objects that are instantiated only once per app (by the $injector) and lazy-loaded (created only when necessary).

They provide a method for us to keep data around for the lifetime of the app and communicate across controllers in a consistent manner.

Question 17

Register a service

Answer 17

There are several ways to create and register a service with the $injector.
The most common and flexible way to create a service uses the angular.module API factory:

angular.module('myApp.services', [])
  .factory('githubService', function() {
    var serviceInstance = {};
    // Our first service
    return serviceInstance;
  });

Question 18

$timeout service

Answer 18

If we don’t include a delay, we’ll end up calling the API for every keystroke that is entered into the input.

Question 19

5 different methods for creating services

Answer 19

factory() 
service() 
constant() 
value() 
provider()

Question 20

The factory() function takes two arguments:

Answer 20

name (string)

This argument takes the name of the service we want to register.

getFn (function)

Question 21

Why use provider() over factory?

Answer 21

If we want to be able to configure the service in the config() function, we must use provider() to define our service.

Question 22

constant()

Answer 22

let’s say we want to set an apiKey for a back-end service. We can store that constant value using constant().

angular.module(‘myApp’)
.constant(‘apiKey’, ‘123123123’)

Question 23

Value()

Answer 23

If the return value of the $get method in our service is a constant, we don’t need to define a full-blown service with a more complex method.

angular.module(‘myApp’)
.value(‘apiKey’, ‘123123123’);

Question 24

When to Use Value or Constant?

Answer 24

The major difference between the value() method and the constant() method is that you can inject a constant into a config function, whereas you cannot inject a value.

Question 25

$http service

Answer 25

is simply a wrapper around the browser’s raw XMLHttpRequest object.

The $http service is a function that takes a single argument: a configuration object that is used to generate a HTTP request.

The function returns a promise that has two helper methods: success and error.

Question 26

$http shortcut methods

Answer 26

get()
   $http.get('/api/users.json');
delete()
url(string)
head()
jsonp()
  $http
    .jsonp("/api/users.json?callback=JSON_CALLBACK"); 
post()
put()

Question 27

Interceptors

Answer 27

Is middleware for the $http service that allow us to inject logic into the existing flow of the app.

At their core, interceptors are service factories that we register through the $httpProvider by adding them to the $httpProvider.interceptors array.

There are four types of interceptors – two success interceptors and two rejection interceptors:

Question 28

What are the 4 types of Interceptors?

Answer 28

Request
Response
requestError
responseError

Question 29

How to register an Interceptor?

Answer 29

angular.module(‘myApp’)
.config(function($httpProvider) { $httpProvider.interceptors.push(‘myInterceptor’);
});

Question 30

$resource

Answer 30

This service creates a resource object that allows us to intelligently work with RESTful server-side data sources. It service allows us to turn our $http requests into simple methods like save or update.

bower install –save angular-resouce

Question 31

$resource htttp methods

Answer 31

Get Methods:
get(params, successFn, errorFn)
query(params, successFn, errorFn)

Non Get Mehods:
save(params, payload, successFn, errorFn)
delete(params, payload, successFn, errorFn)
remove(params, payload, successFn, errorFn)

Question 32

Promise

Answer 32

A promise is a method of resolving a value (or not) in an asynchronous manner. Promises are objects that represent the return value or thrown exception that a function may eventually provide.

Question 33

Why Promise?

Answer 33

Escaping from callback hell is just one by-product of using promises. The real point of promises is to make asynchronous functions look more like synchronous ones. With synchronous functions, we can capture both return values and exception values as expected.