- Get link
- Other Apps
Q11. What are templates in AngularJS?
Ans: In Angular,
templates are written with HTML that contains Angular-specific elements
and attributes. Angular combines the template with information from the
model and controller to render the dynamic view that a user sees in the
browser. In other words, if your HTML page is having some Angular
specific elements/attributes it becomes a template in AngularJS.
Q12. What are directives in AngularJS?
Ans: Directives are
markers on a DOM element (such as an attribute, element name, comment or
CSS class) that tell AngularJS to attach a specified behavior to that
DOM element or even transform the DOM element and its children. When
AngularJS finds the directive at the time of rendering then it attaches
the requested behavior to the DOM element. Angular comes with a set of
these directives built-in, like ngBind, ngModel, and ngClass.
Q13. Can we create our own directives?
Ans: YES. AngularJS allows us to create our own custom directive.
Q14. What are different type or classification of directives?
Ans: AngularJS directives can be classified in 4 different types .
- Element directives
1<ng-directive></ng-directive>
- Attribute directives
1<span ng-directive></span>
- CSS class directives
1<span class="ng-directive: expression;"></span>
- Comment directives
1<!-- directive: ng-directive expression -->
Q15. What is the name of directive is used to bootstrap an angular app?
Ans: ng-app directive is used to auto-bootstrap an AngularJS application. The ng-app
directive defines the root element of the application and is typically
present in the root element of the page - e.g. on the <body> or
<html> tags.
Q16. Can AngularJS have multiple ng-app directives in a single page?
Ans: The answer is NO.
Only one AngularJS application can be auto-bootstrapped per HTML
document. The first ngApp found in the document will be used to define
the root element to auto-bootstrap as an application. If you have placed
another ng-app directive then it will not be processed by AngularJS. You need to manually bootstrap the second app, instead of using second ng-app directive. Read How to define multiple angular apps on the same page?
Q17. Can angular applications (ng-app) be nested within each other?
Ans: NO. AngularJS applications cannot be nested within each other.
Q18. Can you bootstrap multiple angular applications on same element?
Ans: NO. If you try to do that then it will show an error "App Already Bootstrapped with this Element". This usually happens when you accidentally use both ng-app and angular.bootstrap to bootstrap an application. You can also get this error if you accidentally load AngularJS itself more than once.
Q19. In how many different ways, you can define a directive and what is the best practice?
Ans: 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 complies then it normalize the
directives.
Below are example of valid directive declaration.
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-*".
Q20. Mention some angularJS directives and their purpose?
Ans: The beauty of
AngularJS directives is that they are self explainatory. By just looking
at directive name, you will get the idea about purpose and use of
directive. Below are some mostly used directives.
ng-app : Initializes application.
ng-model : Binds HTML controls to application data.
ng-Controller : Attaches a controller class to view.
ng-repeat : Bind repeated data HTML elements. Its like a for loop.
ng-if : Bind HTML elements with condition.
ng-show : Used to show the HTML elements.
ng-hide : Used to hide the HTML elements.
ng-class : Used to assign CSS class.
ng-src : Used to pass the URL image etc.
Event Listeners
ng-click : Click event to bind on HTML elements.
ng-dbl-click
Mouse event listeners
ng-mousedown
ng-mouseup
ng-mouseenter
ng-mouseleave
ng-mousemove
ng-mouseover
Keyboard event listeners
ng-keydown
ng-keyup
ng-keypress
ng-change
It's a long list. You can find about all the directives here.
ng-app : Initializes application.
ng-model : Binds HTML controls to application data.
ng-Controller : Attaches a controller class to view.
ng-repeat : Bind repeated data HTML elements. Its like a for loop.
ng-if : Bind HTML elements with condition.
ng-show : Used to show the HTML elements.
ng-hide : Used to hide the HTML elements.
ng-class : Used to assign CSS class.
ng-src : Used to pass the URL image etc.
Event Listeners
ng-click : Click event to bind on HTML elements.
ng-dbl-click
Mouse event listeners
ng-mousedown
ng-mouseup
ng-mouseenter
ng-mouseleave
ng-mousemove
ng-mouseover
Keyboard event listeners
ng-keydown
ng-keyup
ng-keypress
ng-change
It's a long list. You can find about all the directives here.
That completes Part-2 as well. Keep visiting for upcoming set of interview questions and answers.
Comments
Post a Comment