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 Oct 2022, the current version is 14.2.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


299281 questions
51
votes
7 answers

How to Validate FormArray length in angular2

I have a data driven form in angular2 like below this.formBuilder.group({ 'name': ['',Validators.required], 'description': ['', Validators.required], 'places': this.formBuilder.array([], Validators.minlength(1)) }) I want to add validations…
chandradot99
  • 3,616
  • 6
  • 27
  • 45
51
votes
6 answers

dispatch multiple actions in one effect

I would like to dispatch two actions in one effect. Currently I have to declare two effects to achieve this : // first effect @Effect() action1$ = this.actions$ .ofType(CoreActionTypes.MY_ACTION) .map(res => { return { type: "ACTION_ONE"} …
Lev
  • 13,856
  • 14
  • 52
  • 84
51
votes
9 answers

Clearing Webpack cache

How do you go about forcing webpack to clear its cache? I'm doing a-lot of work with threejs and webpack and for some reason, unbeknownst to me, it has two copies of threejs in memory. Here's the error: This file isn't located in a hidden folder…
Katana24
  • 8,706
  • 19
  • 76
  • 118
51
votes
2 answers

What is the difference between ngAfterContentInit() and ngAfterViewInit()?

What is the difference between functions ngAfterContentInit() and ngAfterViewInit()?
Dariusz Filipiak
  • 2,858
  • 5
  • 28
  • 39
51
votes
4 answers

How to do the chain sequence in rxjs

I would like to to something like: this._myService.doSomething().subscribe(result => { doSomething() }); .then( () => dosthelse() ) .then( () => dosanotherthing() ) So I would like to chain .then like in promise. How would I do that in…
adam nowak
  • 785
  • 2
  • 9
  • 17
51
votes
4 answers

Why do we have install Node.js for Angular 2.0?

I started a tutorial on Angular 2.0, the first step in setting up the workspace is installing Node.js and NPM. Why do we have install Node.js for Angular 2.0? I don't remember doing this for angular 1.X.
user2572003
  • 743
  • 3
  • 8
  • 16
51
votes
4 answers

Launch an event when checking a checkbox in Angular2

I'm newbie in Angular2 and in web globally , I want to launch an action that changes an oject paramater value in the Database when checking a checkbox and or unchecking it using Material-Design, I tried with [(ngModel)] but nothing happened. the…
SeleM
  • 9,310
  • 5
  • 32
  • 51
51
votes
3 answers

Angular 2 - What is equivalent to Root Scope?

All! I've this component where when I click on the href it is supposed to set a variable as Root Scope if it was Angular 1 like this: selector: 'my-component' template : `
` constructor() { …
Marco Jr
  • 6,496
  • 11
  • 47
  • 86
51
votes
5 answers

Why should objects in Redux be immutable?

Why should objects in Redux be immutable? I know that some frameworks such as Angular2 will use onPush and can take advantage of immutability to compare states of views for faster rendering, but I am wondering if there are other reasons as Redux is…
born2net
  • 24,129
  • 22
  • 65
  • 104
51
votes
7 answers

How to create cross-domain request?

How to create a cross-domain request using Angular 2? Can you provide an example? Like a request between localhost:3000 and localhost:8000 cross-domain
Ignat
  • 3,727
  • 6
  • 16
  • 17
51
votes
4 answers

Get which key pressed from (keypress) angular2

Is it possible to find out which key was pressed when using (keypress) in Angular 2? E.g. public eventHandler() { //Some code console.log(keyPressed); } Edit: Seems my naming conventions were a…
TheFisherman
  • 1,239
  • 3
  • 13
  • 17
51
votes
7 answers

Type checking in Angular 2 templates

We are building an application in Angular 2 and TypeScript. We try to statically check types where it is possible. Is there any way to check types in templates? Consider the following fragment: Assume that data in Foo…
jfu
  • 1,700
  • 1
  • 22
  • 31
50
votes
13 answers

Unexpected token '.' when trying to run 'npm install'

I am trying to install the angular cli with 'npm install -g @angular/cli' and I am met with the following error: npm ERR! Unexpected token '.' npm ERR! A complete log of this run can be found in: npm ERR! …
Thomas Stout
  • 503
  • 1
  • 4
  • 8
50
votes
8 answers

How to fix: (node:12364) [DEP0111] DeprecationWarning: Access to process.binding('http_parser') is deprecated

ng serve -o shows the following error message: - Generating browser application bundles...(node:12364) [DEP0111] DeprecationWarning: Access to process.binding('http_parser') is deprecated. (Use `node --trace-deprecation ...` to show where the…
Christoph1972
  • 786
  • 3
  • 10
  • 21
50
votes
8 answers

BrowserslistError: Unknown version 67 of android

I have created one angular library using angular 8 and CLI 8. I am trying to build the library, but I am getting the error. ng build I have gone through some questions posted related to this error, most of them say remove node_modules…
Kaustubh Khare
  • 3,280
  • 2
  • 32
  • 48
1 2 3
99
100