| AngularJS-QA-1 | AngularJS-QA-3 | |
AngularJS Question Answers - 2 |
| Question: | Give example of Standard DDO objects parameters in AngularJS? |
| Answer: | A standard DDO object has following parameters.
var directiveDefinitionObject = {
priority: 0,
template: '<div> </div>', // or //function(tElement, tAttrs) {...},
// or
// templateUrl: 'directive.html', // or // function(tElement, tAttrs) {...},
transclude: false,
restrict: 'A',
templateNamespace: 'html',
scope: false,
controller: function($scope, $element, $attrs, $transclude, othrInjects) {...},
controllerAs: 'stringIdentifier',
bindToController: false,
require: 'siblingDirectiveName',
// or
// ['^parentDirectiveName', '?optionalDirectiveName', '?^optionalParent'],
compile: function compile(tElement, tAttrs, transclude) {
return {
pre: function preLink(scope, iElement, iAttrs, controller) { ... },
post: function postLink(scope, iElement, iAttrs, controller) { ... }
}
// or
// return function postLink( ... ) { ... }
},
// or
// link: {
// pre: function preLink(scope, iElement, iAttrs, controller) { ... },
// post: function postLink(scope, iElement, iAttrs, controller) { ... }
// }
// or
// link: function postLink( ... ) { ... }
};
|
| Question: | How you keep an eye on number of watches in AngularJS? |
| Answer: | A utility called ng-stats can help to track our watch count and digest cycles. |
| Question: | Explain what is injector? |
| Answer: | An injector is a service locator, used to retrieve object instances. |
| Question: | Explain what is injector? |
| Answer: | An injector is a service locator. It is used to retrieve object instances as defined by provider, instantiate types, invoke methods and load modules. There is a single injector per Angular application, it helps to look up an object instance by its name. |
| Question: | In how many different ways, you can define a directive and what is the best practice? |
| Answer: | Angular generally prefers camelCase for directives. But since HTML is not case-sensitive so it refers to directive in DOM in lower case form, delimited by dash (eg. ng-app). But when Angular compiles then it normalize the directives.
Below are example of valid directive declaration. ng-model ngModel ng:model ng_model data-ng-model x-ng-model The normalization process is as follows: 1. Strip x- and data- from the front of the element/attributes. 2. Convert the :, -, or _-delimited name to camelCase. The best practice to use dash-delimited (ng-model) or directly camelCase form (ngModel). If you are using HTML validation tool, then it is advised to use data- prefixed version. And it also answers another question which is ""Difference between ng-* and data-ng-*"". |
| Question: | What are different type or classification of directives? |
| Answer: | AngularJS directives can be classified in 4 different types . Element directives Attribute directives CSS class directives Comment directives |
| Question: | On which types of component can we create a custom directive? |
| Answer: | AngularJS provides support to create custom directives for the following:
Element directives − Directive activates when a matching element is encountered. Attribute − Directive activates when a matching attribute is encountered. CSS − Directive activates when a matching css style is encountered. Comment − Directive activates when a matching comment is encountered. |
| Question: | How would you specify that a scope variable should have one-time binding only? |
| Answer: | By using “::” in front of it. This allows the check if the candidate is aware of the available variable bindings in AngularJS. |
| Question: | If you were to migrate from Angular 1.4 to Angular 1.5, what is the main thing that would need refactoring? |
| Answer: | Changing .directive to .component to adapt to the new Angular 1.5 components |
| Question: | What are the three ways to communicate between modules of your application using core AngularJS functionality? |
| Answer: | Common ways to communicate between modules of your applications are:
Using services Using events By assigning models on $rootScope Directly between controllers, using $parent, $$childHead, $$nextSibling, etc. Directly between controllers, using ControllerAs, or other forms of inheritance |
| AngularJS-QA-1 | AngularJS-QA-3 | |