AngularJS Interview Questions Part - 5
Q 1. What are filters in
AngularJS?
Ans 1. Filters
can be used to format data or select a subset of items from array and
return it as a new array. Filters can be added to expressions by using the pipe
character |, followed by a filter.
Example- {{FirstName |
uppercase}}
RESULT -
Q 2. How to use lowercase filter in AngularJS?
Ans 2. The lowercase filter converts a text to lower case text. Add lowercase filter to an expression using pipe character.
Example- {{employee.LastName |
lowercase}}
Click here to watch more informative AngularJS Tutorial videos!
Q 3. How to use uppercase
filter in AngularJS?
Ans 3. The uppercase filter converts a text to upper case text. Add uppercase filter to
an expression using pipe character.
Example- {{FirstName |
uppercase}}
RESULT -
Q 4. How to use currency
filter in AngularJS?
Ans 4. The currency filter formats text in a currency format. Add currency filter to an
expression returning number using pipe character.
Example- {{employee.Salary | currency}}
In the above example Salary will be formatted as
currency and displayed.
Q 5. How to use filter
filter in AngularJS?
Ans 5. The filter filter is used to filter the array to a subset of it based on
provided criteria.
Example-
<body ng-app="ngApp"
ng-init="Employees = [{FirstName:'steven', LastName:'WADE', Salary:60000},
{FirstName:'steve', LastName:'WATSON', Salary:50000},
{FirstName:'gilbert', LastName:'SCOTT',
Salary:80000}]">
<input type="text" ng-model="filterValue"/>
</br></br><table>
<tr ng-repeat="employee in Employees | filter:filterValue">
<td>{{employee.FirstName | uppercase}}</td>
<td>{{employee.LastName | lowercase}}</td>
<td>{{employee.Salary | currency}}</td>
</tr>
</table>
</body>
RESULT-
Before Filtering -
In the above example, the array will be filtered by
the value in the input text box before being displayed in the table.
Q 6. How to use orderBy
filter in AngularJS?
Ans 6. The orderBy filter orders the collection based on provided criteria.
Example –
<body
ng-app="ngApp" ng-init="Employees = [{FirstName:'steven',
LastName:'WADE', Salary:60000}, {FirstName:'steve', LastName:'WATSON',
Salary:50000}, {FirstName:'gilbert', LastName:'SCOTT', Salary:80000}]">
<tr ng-repeat="employee in Employees | orderBy:'Salary'">
<td>{{employee.FirstName | uppercase}}</td>
<td>{{employee.LastName | lowercase}}</td>
<td>{{employee.Salary | currency}}</td>
</tr>
</body>
RESULT -
Before ordering -
After ordering -
In the above example, the array is ordered before
displaying the values in the table.
No comments:
Post a Comment