Questions tagged [angular]

Questions about Angular (not to be confused with AngularJS), the web framework from Google. Use this tag for Angular questions which are not specific to an individual version. For the older AngularJS (1.x) web framework, use the angularjs tag.

The spiritual successor to the older AngularJS web framework.
(Questions about the older framework should use the tag instead.)

Features and Benefits


Building Blocks of Angular Apps

  • Module: A typical module is a cohesive block of code dedicated to a single purpose. A module exports something of value in that code, typically one thing such as a class.

  • Component: A component is a building block with component metadata. In TypeScript, we'd apply the @Component decorator to attach metadata to the class. This metadata mainly consists of the template or templateUrl, the selector, and the attached styling.

  • Template: We define a Component's view with its companion template. A template is a form of HTML that tells Angular how to render the Component.

  • Metadata: Metadata tells Angular how to process a class.

  • Data Binding: Angular supports data binding, a mechanism for coordinating parts of a template with parts of a component. There are four forms of data-binding syntax:

    • Interpolation: {{value}}
    • Property binding : [property]="value"
    • Event Binding : (event)="handler"
    • Two-way data binding: [(ngModel)]="property"
  • Service: "Service" is a broad category encompassing any value, function or feature that our application needs.

  • Directive: A directive is a class with directive metadata. In TypeScript, we'd apply the @Directive decorator to attach metadata to the class.

  • Dependency Injection: "Dependency Injection" is a way to supply a new instance of a class with the fully-formed dependencies it requires. Most dependencies are services. Angular uses dependency injection to provide new components with the services they need.

  • Pipes: Pipes are used for transforming values from one form to another. Angular offers many built-in pipes. Also, you can create custom pipes too.


See the changelog for latest version information.

As of Nov 2020, the current version is 11.0.0. See the full release schedule on the official GitHub repository. Angular versioning follows Semantic Versioning principles; all major versions feature some breaking changes over the previous ones.

Consider using the Update Guide for tips before changing the version.


Browser Support

  • Latest versions of Chrome, Edge, Firefox, IE, and Safari
  • Tested for older browsers including IE9+ and Android 4.1+

Useful links


Books


Code Editors & IDEs


Rich UI components for Angular


Cross-Platform Development


Related tags


Official Logo:

angular logo


Official Website:

angular.io


253958 questions
1656
votes
46 answers

Can't bind to 'ngModel' since it isn't a known property of 'input'

I've got the following error when launching my Angular app, even if the component is not displayed. I have to comment out the so that my app works. zone.js:461 Unhandled Promise rejection: Template parse errors: Can't bind to 'ngModel' since…
Anthony Brenelière
  • 48,644
  • 13
  • 37
  • 50
1582
votes
30 answers

What is the difference between Promises and Observables?

What is the difference between Promise and Observable in Angular? An example on each would be helpful in understanding both the cases. In what scenario can we use each case?
Rohit
  • 15,907
  • 3
  • 8
  • 9
1234
votes
26 answers

Difference between Constructor and ngOnInit

Angular provides life cycle hook ngOnInit by default. Why should ngOnInit be used, if we already have a constructor?
Haseena P A
  • 14,256
  • 4
  • 15
  • 30
982
votes
35 answers

Can't bind to 'formGroup' since it isn't a known property of 'form'

THE SITUATION: Please help! I am trying to make what should be a very simple form in my Angular2 app but no matter what it never works. ANGULAR VERSION: Angular 2.0.0 Rc5 THE ERROR: Can't bind to 'formGroup' since it isn't a known property of…
FrancescoMussi
  • 17,011
  • 36
  • 113
  • 166
956
votes
23 answers

Angular HTML binding

I am writing an Angular application and I have an HTML response I want to display. How do I do that? If I simply use the binding syntax {{myVal}} it encodes all HTML characters (of course). I need somehow to bind the innerHTML of a div to the…
Aviad P.
  • 28,132
  • 10
  • 97
  • 112
824
votes
11 answers

BehaviorSubject vs Observable?

I'm looking into Angular RxJs patterns and I don't understand the difference between a BehaviorSubject and an Observable. From my understanding, a BehaviorSubject is a value that can change over time (can be subscribed to and subscribers can receive…
Kevin Mark
  • 8,313
  • 3
  • 7
  • 10
821
votes
25 answers

Angular/RxJs When should I unsubscribe from `Subscription`

When should I store the Subscription instances and invoke unsubscribe() during the NgOnDestroy life cycle and when can I simply ignore them? Saving all subscriptions introduces a lot of mess into component code. HTTP Client Guide ignore…
792
votes
22 answers

Angular: conditional class with *ngClass

What is wrong with my Angular code? I am getting the following error: Cannot read property 'remove' of undefined at BrowserDomAdapter.removeClass
  1. Step1
  2. daniel
    • 28,673
    • 36
    • 87
    • 145
755
votes
19 answers

How to use *ngIf else?

I'm using Angular and I want to use *ngIf else (available since version 4) in this example:
content here ...
other content here...
How can I acheive the same behavior with ngIf else ?
El houcine bougarfaoui
  • 29,581
  • 7
  • 34
  • 35
695
votes
9 answers

ngFor with index as value in attribute

I have a simple ngFor loop which also keeps track of the current index. I want to store that index value in an attribute so I can print it. But I can't figure out how this works. I basically have this:
678
votes
49 answers

Could not find module "@angular-devkit/build-angular"

After updating to Angular 6.0.1, I get the following error on ng serve: Could not find module "@angular-devkit/build-angular" from "/home/Projects/myProjectName". Error: Could not find module "@angular-devkit/build-angular" from…
ForestG
  • 13,602
  • 7
  • 31
  • 56
653
votes
20 answers

What is the equivalent of ngShow and ngHide in Angular 2+?

I have a number of elements that I want to be visible under certain conditions. In AngularJS I would write
stuff
How can I do this in Angular 2+?
Mihai Răducanu
  • 9,553
  • 4
  • 19
  • 28
620
votes
15 answers

Huge number of files generated for every Angular project

I wanted to start a simple hello world app for Angular. When I followed the instructions in the official quickstart the installation created 32,000 files in my project. I figured this is some mistake or I missed something, so I decided to use…
Moshe Shaham
  • 13,702
  • 20
  • 65
  • 100
616
votes
14 answers

How can I select an element in a component template?

Does anybody know how to get hold of an element defined in a component template? Polymer makes it really easy with the $ and $$. I was just wondering how to go about it in Angular. Take the example from the tutorial: import {Component} from…
Aman Gupta
  • 6,735
  • 5
  • 13
  • 24
603
votes
14 answers

How to detect when an @Input() value changes in Angular?

I have a parent component (CategoryComponent), a child component (videoListComponent) and an ApiService. I have most of this working fine i.e. each component can access the json api and get its relevant data via observables. Currently video list…
Jon Catmull
  • 8,285
  • 5
  • 17
  • 16
1
2 3
99 100