Explore the best free resource to learn Angular and kickstart your journey as an angular frontend developer here. Earn a free certification in just 25 days.
You can download the PDF and Epub version of this repository from the latest run on the actions tab.
What is Angular? Why was it introduced?
Angular was introduced to create Single Page applications. This framework brings structure and consistency to web applications and provides excellent scalability and maintainability.Â
Angular is an open-source, JavaScript framework wholly written in TypeScript. It uses HTMLs syntax to express your applications components clearly.Â
TypeScript is a superset of JavaScript that offers excellent consistency. It is highly recommended, as it provides some syntactic sugar and makes the code base more comfortable to understand and maintain. Ultimately, TypeScript code compiles down to JavaScript that can run efficiently in any environment.Â
Question: What Does the Representation [()] Mean?
Answer: This is a representation for ngModel used for two-way data binding. It is written as [(ngModel)] = “propertyvalue”.
Question: What Is a Component?
Answer: The component is a logical piece of code. The component consists of the template (that contains the HTML (or URL) that needs to be rendered), class (class that defines properties and methods that supports the view) and metadata (defined using decorator).
@Component ({ selector: my-app, template: `
{{appTitle}}
, })
3 How are Angular expressions different from JavaScript expressions?
One major difference between Angular expressions and JavaScript expressions is that Angular expressions are compiled while JavaScript expressions are not. This means that Angular expressions are more efficient since theyre already pre-processed. Additionally, Angular expressions can access scope properties while JavaScript expressions cannot. Finally, Angular expressions support some additional features such as filters and directives which arent available in JavaScript expressions.
Javascript expression example:
     Â
     Â
         Â
         Â
         Â
     Â
     Â
         Â
     Â
     Â
          use strict;
          let bar = {};
          document.getElementById(foo).innerHTML = bar.x;
     Â
     Â
Angular expression example:
import { Component, OnInit } from @angular/core;
      @Component({
        selector: app-new,
        template: `
           Â
{{message}}
        `,
        styleUrls: [./new.component.css]
      })
      export class NewComponent implements OnInit {
        message:object = {};
        constructor() { }
        ngOnInit() {
        }
      }
1 What are Pipes in Angular?Â
Pipes are simple functions designed to accept an input value, process, and return as an output, a transformed value in a more technical understanding. Angular supports several built-in pipes. However, you can also create custom pipes that cater to your needs.Â
Some key features include:Â