AngularJS Interview Questions: Set 3

The article represents the 3rd set of 10 interview questions. The following are previous two sets that have been published earlier on our website.

Following are other sets that we recommend you to go through.

• Interview questions Set 1
• Interview questions Set 2

Q1: Directives can be applied to which all element type?

Ans: Following represents the element type and directive declaration style:

`E` – Element name: `<my-directive></my-directive>`
`A` – Attribute (default): `<div my-directive=”exp”></div>`
`C` – Class: `<div class=”my-directive: exp;”></div>`
`M` – Comment: `<!– directive: my-directive exp –>`

Q2. What is notion of “isolate” scope object when creating a custom directive? How is it different from the normal scope object?

Ans: When creating a custom directive, there is a property called as “scope” which can be assigned different values such as true/false or {}. When assigned with the value “{}”, then a new “isolate” scope is created. The ‘isolate’ scope differs from normal scope in that it does not prototypically inherit from the parent scope. This is useful when creating reusable components, which should not accidentally read or modify data in the parent scope.

Q3. What are different return types from compile function?

Ans: A compile function can have a return value which can be either a function or an object.

• A (post-link) function: It is equivalent to registering the linking function via the `link` property of the config object when the compile function is empty.
• An object with function(s) registered via `pre` and `post` properties. It allows you to control when a linking function should be called during the linking phase.

Q4. WHich API need to be invoked on the rootScope service to get the child scopes?

Ans: $new

Q5. Explain the relationship between scope.$apply & scope.$digest?

Ans: As an event such as text change in a textfield happens, the event is caught with an eventhandler which then invokes $apply method on the scope object. The $apply method in turn evaluates the expression and finally invokes $digest method on the scope object. Following code does it all:

$apply: function(expr) {
        try {
          beginPhase('$apply');
          return this.$eval(expr);
        } catch (e) {
          $exceptionHandler(e);
        } finally {
          clearPhase();
          try {
            $rootScope.$digest();
          } catch (e) {
            $exceptionHandler(e);
            throw e;
          }
        }
}

Q6. Which angular module is loaded by default?

Ans: ng

Q7. What angular function is used to manually start an application?

Ans: angular.bootstrap

Q8. Name some of the methods that could be called on a module instance? For example, say, you instantiated a module such as ‘var helloApp = angular.module( “helloApp”, [] );’. What are different methods that could be called on helloApp instance?

Ans: Following are some of the methods:

• controller
• factory
• directive
• filter
• constant
• service
• provider
• config

Q9. Which angular function is used to wrap a raw DOM element or HTML string as a jQuery element?

Ans: angular.element; If jQuery is available, `angular.element` is an alias for the jQuery function. If jQuery is not available, `angular.element` delegates to Angular’s built-in subset of jQuery, called “jQuery lite” or “jqLite.”

Q10. Write sample code representing an injector that could be used to kick off your application?

var $injector = angular.injector(['ng', 'appName']);
$injector.invoke(function($rootScope, $compile, $document){
    $compile($document)($rootScope);
    $rootScope.$digest();
});

Feel free to suggest any changes in above answers if you feel so.