Latest ads
-
🔒 NordVPN Premium – 3 Months- hrdilshan
- Updated:
-
🚀 Microsoft Office 365 Pro Plus – Lifetime Access! 🚀- hrdilshan
- Updated:
-
Colombo YEYE 3 in 1 Instant Coffee Mix 50 Sachet- Romeshka
- Updated:
-
Colombo Red Hat Certified System Administrator (RHCSA) - RHEL 10- Sanjeewani95
- Updated:
Angular Interview Questions
- Thread starter cscuser
- Start date
machan interview eka thibbata passe meke update ekak diyan ah 
මේ තියෙන්නේ මගෙන් අහපු ප්රශ්න සෙට් එක. හැබැයි මේ එක ඉන්ටර්විව් එකකින් අහපුව නෙමෙයි ඉන්ටවිව් දෙක තුනකින් අහපුවගේ කොමන් ම සෙට් එක අරගෙන මන් ගූගල් ඩොක් එකක් හැදුවා ඒක තමයි මේක.
What is angular?
Angular is an open-source, JavaScript framework wholly written in TypeScript. It uses HTML syntax to express your application's components clearly.
Explain the lifecycle hooks in Angular.
In Angular, every component has a lifecycle. Angular creates and renders these components and also destroys them before removing them from the DOM. This is achieved with the help of lifecycle hooks. Here are the list of them -
What are Directives in Angular?
Directives are attributes that allow the user to write new HTML syntax specific to their applications. They execute whenever the Angular compiler finds them in the DOM. Angular supports three types of directives.
Components are the basic building blocks of the user interface in an Angular application. Every component is associated with a template and is a subset of directives. An Angular application typically consists of a root component, which is the AppComponent, that then branches out into other components creating a hierarchy.
What are Eager and Lazy loading?
Eager loading is the default module-loading strategy. Feature modules under Eager loading are loaded before the application starts. This is typically used for small-size applications.
Lazy loading dynamically loads the feature modules when there's a demand. This makes the application faster. It is used for bigger applications where all the modules are not required at the start.
What is data binding?
Angular uses the two-way binding. Any changes made to the user interface are reflected in the corresponding model state. Conversely, any changes in the model state are reflected in the UI state. This allows the framework to connect the DOM to the Model data via the controller. However, this approach affects performance since every change in the DOM has to be tracked.
HttpClient vs HttpClientModule
HttpClientModule -
The HttpClientModule imported from NgModule which provides the HttpClient and is associated with components services and the interceptors can be added to the chain behind HttpClient by binding them to the multi-provider for HTTP_INTERCEPTORS.
HttpClient
The HttpClient is used to perform HTTP requests.
Angular Promises Versus Observables
View encapsulation
Differences between Template-driven and Reactive Forms
Object-Oriented Programming (OOP)
What is angular?
Angular is an open-source, JavaScript framework wholly written in TypeScript. It uses HTML syntax to express your application's components clearly.
Explain the lifecycle hooks in Angular.
In Angular, every component has a lifecycle. Angular creates and renders these components and also destroys them before removing them from the DOM. This is achieved with the help of lifecycle hooks. Here are the list of them -
- ngOnChanges() - Responds when Angular sets/resets data-bound input properties.
- ngOnInit() - Initialize the directive/component after Angular first displays the data-bound properties and sets the directive/component's input properties.
- ngDoCheck() - Detects and acts upon changes that Angular can't or won't detect on its own.
- ngAfterContentInit() - Responds after Angular projects external content into the component's view.
- ngAfterContentChecked() - Respond after Angular checks the content projected into the component.
- ngAfterViewInit() - Respond after Angular initializes the component's views and child views.
- ngAfterViewChecked() - Respond after Angular checks the component's views and child views.
- ngOnDestroy - Cleanup just before Angular destroys the directive/component.
What are Directives in Angular?
Directives are attributes that allow the user to write new HTML syntax specific to their applications. They execute whenever the Angular compiler finds them in the DOM. Angular supports three types of directives.
- Component Directives
- Structural Directives
- Attribute Directives
Components are the basic building blocks of the user interface in an Angular application. Every component is associated with a template and is a subset of directives. An Angular application typically consists of a root component, which is the AppComponent, that then branches out into other components creating a hierarchy.
What are Eager and Lazy loading?
Eager loading is the default module-loading strategy. Feature modules under Eager loading are loaded before the application starts. This is typically used for small-size applications.
Lazy loading dynamically loads the feature modules when there's a demand. This makes the application faster. It is used for bigger applications where all the modules are not required at the start.
What is data binding?
Angular uses the two-way binding. Any changes made to the user interface are reflected in the corresponding model state. Conversely, any changes in the model state are reflected in the UI state. This allows the framework to connect the DOM to the Model data via the controller. However, this approach affects performance since every change in the DOM has to be tracked.
HttpClient vs HttpClientModule
HttpClientModule -
The HttpClientModule imported from NgModule which provides the HttpClient and is associated with components services and the interceptors can be added to the chain behind HttpClient by binding them to the multi-provider for HTTP_INTERCEPTORS.
HttpClient
The HttpClient is used to perform HTTP requests.
Angular Promises Versus Observables
| Observables | Promises |
| Emit multiple values over a period of time. | Emit a single value at a time. |
| Are lazy: they’re not executed until we subscribe to them using the subscribe() method. | Are not lazy: execute immediately after creation. |
| Have cancellable subscriptions using the unsubscribe() method, which stops the listener from receiving further values. | Are not cancellable. |
| Provide the map for forEach, filter, reduce, retry, and retry when operators. | Don’t provide any operations. |
| Deliver errors to the subscribers. | Push errors to the child's promises. |
View encapsulation
Differences between Template-driven and Reactive Forms
- Template-driven forms make use of the "FormsModule", while reactive forms are based on "ReactiveFormsModule".
- Template-driven forms are asynchronous in nature, whereas Reactive forms are mostly synchronous.
- In a template-driven approach, most of the logic is driven by the template, whereas in a reactive-driven approach, the logic resides mainly in the component or typescript code. Let us get started by generating a component and then we'll update our form code.
- Just-in-Time (JIT), which compiles your app in the browser at runtime.
- Ahead-of-Time (AOT), which compiles your app at build time.
Object-Oriented Programming (OOP)
- Inheritance,
- Abstraction,
- Polymorphism,
- And Encapsulation.
Very good
I will add something
1. Interceptors
https://ultimatecourses.com/blog/intro-to-angular-http-interceptors
2. Angular Reactive Forms and Validators
https://angular.io/guide/reactive-forms
3. angular-internationalization(usage of i18n)
https://www.digitalocean.com/community/tutorials/angular-internationalization
4. Angular Nested Components and Communication
5. What is shadow DOM?
6. Angular Security. How to prevent well-known hacks
7. Angular Test. How to mock a Component and Unit test (Amaruma kalla thama meka)
Jasmine nangiwa balaganna wenawa.
8. EventEmitter , Input , OutPut
9. Common Errors in Angular (specially for angular 14)
"Property 'ClientName' has no initializer and is not definitely assigned in the constructor"
