The Angular 9 RC is out, what an exciting time to be Angular developer. Ivy is here, Ivy is now the default rendering engine in Angular. Follow along and check latest Angular X Interview Questions and Answers with latest Ivy updates for 2020.
Q44: When would you use eager module loading? ⭐⭐⭐
See Answer
Q. What is a custom pipe?
A pipe is a class decorated with pipe metadata @Pipe()
decorator, which you import from the core Angular library
The pipe class implements the PipeTransform() interface transform method that accepts an input value followed by optional parameters and returns the transformed value.
The @Pipe()
decorator allows to define the pipe name that youll use within template expressions. It must be a valid JavaScript identifier.
Example:
Now you can use the above pipe in template expression as below,
Q. What are the utility functions provided by RxJS?
The RxJS library also provides below utility functions for creating and working with observables.
Q. What are components in angular?
Components are the most basic UI building block of an Angular app which formed a tree of Angular components. These components are subset of directives. Unlike directives, components always have a template and only one component can be instantiated per an element in a template.
Q. What is the purpose of metadata json files?
The metadata.json file can be treated as a diagram of the overall structure of a decorator metadata, represented as an abstract syntax tree(AST). During the analysis phase, the AOT collector scan the metadata recorded in the Angular decorators and outputs metadata information in .metadata.json files, one per .d.ts file.
Q. What selector force a style down through the child component tree into all the child component views?
Component styles normally apply only to the HTML in the components own template.
Use the ::ng-deep
shadow-piercing descendant combinator to force a style down through the child component tree into all the child component views. The ::ng-deep
combinator works to any depth of nested components, and it applies to both the view children and content children of the component.
Example:
The following example targets all
elements, from the host element down through this component to all of its child elements in the DOM.
parent.component.html:
parent.component.css:
child.component.html:
Angular services are singleton objects which get instantiated only once during the lifetime of an application. It contains method that maintain data throughout the life of an application, i.e. data does not get refreshed and is available all the time. The main objective of a service is to organize and share business logic, models, or data and functions with different components of an Angular application.
Benefits:
An Angular service is a stateless object and provides some very useful functions. These functions can be invoked from any component of Angular, like Controllers, Directives, etc. This helps in dividing the web application into small, different logical units which can be reused.
The above service uses Http service as a dependency.
Q. What is hammerjs in angular?
HammerJS gives us access to mobile gesture events that are not normally found in the browser, including tap
, swipe
, pan
, pinch
, press
, and rotate
.
Add the import to main.ts
to make the events globally available in your application.
Gesture Recognizers: