Skip to main content

AngularJS interview questions - Part 2

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
  • 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.
  • 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.
Mouse event listeners

Keyboard event listeners

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.


Popular posts from this blog

Symbols Used in Excel Formula | The purpose of Symbols in Excel Formula

Following symbols are used in Excel Formula. They will perform different actions in Excel Formulas and Functions. Each of these special characters have used for different purpose in Excel. Symbol Name Description = Equal to Every Excel Formula begins with Equal to symbol (=). Example: = B1+B6 () Parentheses All Arguments of the Excel Functions specified between the Parentheses. Example: =COUNTIF ( B1:B5,5 ) () Parentheses Expressions specified in the Parentheses will be evaluated first. Parentheses changes the order of the evaluation in Excel Formula. Example:   =25+ ( 35*2 ) +5 * Asterisk Wild card operator to to denote all values in a List. Example:   =COUNTIF(B1:B5,” * “) , Comma List of the Arguments of a Function Separated by Comma in Excel Formula. Example:   =COUNTIF(B1:B5 , “>” &C1) & Ampersand Concatenate Operator to connect two strings into one in Excel Formula. Example:   =”Total: “ & SUM(C2:C25) $ Dollar Makes Cell Reference as Absolute in Excel Formula. Exam

How to create a Barcode Using PHP Barcode 128 Generator

A barcode is an optical, machine-readable, representation of data, the data usually describes something about the object that carries the barcode.We will use PHP to generate Barcode in this tutorial. In this script, we are using coding which will generate barcodes in barcode format Code 128 . First, we will create index.php which will ask for the user input for which Barcode has to be created PHP Barcode Generator <fieldset><legend>Detail Informations</legend><form action="createbarcode.php" method="post"><b>Enter Your Code </b><input name="barcode" type="text" /><input type="submit" value="Create Barcode" /></form></fieldset> Now we will create createbarcode.php which will call function from Barcode code128 class for creating barcode <? php include('barcode128.php'); // include php barcode 128 class // design our barcode display echo

How to change a MySQL database’s table prefix

Changing a database table prefix is easy and here’s the simple step-by-step guide! For WordPress installations, it’s essential! How to change a prefix 1. In your text editor, change database_name, old_prefix_ and new_prefix_ to the required values: SET @database = "database_name"; SET @old_prefix = "old_prefix_"; SET @new_prefix = "new_prefix_"; SELECT concat( "RENAME TABLE ", TABLE_NAME, " TO ", replace(TABLE_NAME, @old_prefix, @new_prefix), ';' ) AS "SQL"  FROM information_schema.TABLES WHERE TABLE_SCHEMA = @database; 2. Run the query in cPanel or PHPMyAdmin on your WordPress database 3. The output will be a series of SQL queries that will rename the tables for you 4. Run the output 5. Done!   How to add a prefix    If your database doesn’t have a prefix at all, follow the steps above but use the below query that’s been slightly modified fo