1. What is Angular 5?
Angular is a framework for building client applications in HTML and either JavaScript or a language like a TypeScript that compiles to JavaScript.It is best suited for Single Page Application(SPA).
2.Why Angular?
- User Experience similar to a Desktop Application
- Productivity and Tooling
- Performance
- Community
- Full-featured Framework
- Platform for Targeting Native Mobile, not just Web Browsers
- TypeScript
- Angular 2 was written in TypeScript, a superset of JavaScript that implements many new ES2016+ features.
- Modular
- Hence angular have clean and clear structure.
- Unit Testing
- Easy to Unit Test and easy to maintain the code.
3. What’s New in Angular 5?
The Angular 5 Contains bunch of new features, performance improvements and a lot of bug fixes and also some surprises to Angular lovers.
- Make AOT the default
- Watch mode
- Type checking in templates
- More flexible metadata
- Remove *.ngfactory.ts files
- Better error messages
- Smooth upgrades
- Tree-Shakeable components
- Hybrid Upgrade Application
- Performance Improvements
4. What’s New in Angular 4?
Angular 4 contains some additional Enhancement and Improvement. Consider the following enhancements.
- Smaller & Faster Apps
- View Engine Size Reduce
- Animation Package
- NgIf and ngFor Improvement
- Template
- NgIf with Else
- Use of AS keyword
- Pipes
- HTTP Request Simplified
- Apps Testing Simplified
- Introduce Meta Tags
- Added some Forms Validators Attributes
- Added Compare Select Options
- Enhancement in Router
- Added Optional Parameter
- Improvement Internationalization
5. What Is Angular CLI?
The Angular CLI is a tool to initialize, develop, scaffold and maintain Angular applications.Using CLI , you can create a UNIT and END-TO-END test fo the Angular application.
6. What Is Bootstrapping in Angular?
main.ts is the entry point of your application, compiles the application with just-in-time and bootstrap the application.The Bootstrap is the root AppComponent that Angular creates and inserts into the “index.html” host web page.The bootstrapping process creates the components listed in the bootstrap array and inserts each one into the browser (DOM).
The bootstrapping process sets up the execution environment, digs the root AppComponent out of the module’s bootstrap array, creates an instance of the component and inserts it within the element tag identified by the component ’s.selector
7. What Is Architecture Overview of Angular?
Modules
- Angular apps are modular in nature.
- The angular application is nothing but collections of individual modules.
- Angular has its own modularity system called NgModules.
- Every Angular app has at least one NgModule class, the root module, conventionally named.AppModule
- An NgModule, whether a root or feature, is a class with a@NgModule decorator.
Components
- A component controls a patch of the screen called a view.
- You define a component’s application logic—what it does to support the view—inside a class. The class interacts with the view through an API of properties and methods.
- Angular creates, updates, and destroys components as the user moves through the application.
- At least one component should be there called Root Component(app.component.ts)
- Components have @component decorator , contains selector , template,templateUrl , style , styleUrls , providers.
- selector: CSS selector that tells Angular to create and insert an instance of this component where it finds a <hero-list>tag in parent HTML. For example, if an app’s HTML contains,<hero-list></hero-list> then Angular inserts an instance of the view HeroListComponent between those tags.
- templateUrl: module-relative address of this component’s HTML template, shown above.
- providers: an array of dependency injection providers for services that the component requires.
Templates
- You define a component’s view with its companion template. A template is a form of HTML that tells Angular how to render the component.
- A template looks like regular HTML
Data binding
Angular supports data binding, a mechanism for coordinating parts of a template with parts of a component. Add binding markup to the template HTML to tell Angular how to connect both sides.
Directives
Angular templates are dynamic. When Angular renders them, it transforms the DOM according to the instructions given by directives.
A directive is a class with a @Directive decorator.
Services
A class contains the Business Logic.