Socket
Socket
Sign inDemoInstall

@angular/forms

Package Overview
Dependencies
7
Maintainers
2
Versions
784
Alerts
File Explorer

Advanced tools

Install Socket

Detect and block malicious and high-risk dependencies

Install

    @angular/forms

Angular - directives and services for creating forms


Version published
Weekly downloads
2.5M
increased by3.69%
Maintainers
2
Install size
1.91 MB
Created
Weekly downloads
 

Package description

What is @angular/forms?

The @angular/forms package is a part of the Angular framework that provides tools for creating and managing forms in Angular applications. It offers two approaches: Reactive Forms and Template-driven Forms, which allow developers to handle user input and form validation in a robust and scalable way.

What are @angular/forms's main functionalities?

Reactive Forms

Reactive Forms provide a model-driven approach to handling form inputs whose values change over time. This feature allows for more flexible, scalable, and testable forms.

import { ReactiveFormsModule } from '@angular/forms';

@NgModule({
  imports: [
    // other imports ...
    ReactiveFormsModule
  ],
})
export class AppModule { }

Template-driven Forms

Template-driven Forms are useful for adding simple forms to your app with minimal setup. They are less flexible than Reactive Forms but can be easier to use for basic scenarios.

import { FormsModule } from '@angular/forms';

@NgModule({
  imports: [
    // other imports ...
    FormsModule
  ],
})
export class AppModule { }

Form Validation

The package provides built-in validators as well as the ability to create custom validators, making it easy to implement complex validation logic for form fields.

import { FormControl } from '@angular/forms';

let email = new FormControl('', [Validators.required, Validators.email]);

Form Groups

Form Groups are used to group together multiple form controls into one object, allowing for easier management of form data and validation.

import { FormGroup, FormControl } from '@angular/forms';

let userForm = new FormGroup({
  firstName: new FormControl(),
  lastName: new FormControl(),
  age: new FormControl()
});

Other packages similar to @angular/forms

Changelog

Source

18.0.0-next.2 (2024-03-28)

Breaking Changes

compiler-cli

    • Angular no longer supports TypeScript versions older than 5.4.

core

  • ComponentFixture.whenStable now matches the ApplicationRef.isStable observable. Prior to this change, stability of the fixture did not include everything that was considered in ApplicationRef. whenStable of the fixture will now include unfinished router navigations and unfinished HttpClient requests. This will cause tests that await the whenStable promise to time out when there are incomplete requests. To fix this, remove the whenStable, instead wait for another condition, or ensure HttpTestingController mocks responses for all requests. Try adding HttpTestingController.verify() before your await fixture.whenStable to identify the open requests. Also, make sure your tests wait for the stability promise. We found many examples of tests that did not, meaning the expectations did not execute within the test body.

    In addition, ComponentFixture.isStable would synchronously switch to true in some scenarios but will now always be asynchronous.

router

  • When a a guard returns a UrlTree as a redirect, the redirecting navigation will now use replaceUrl if the initial navigation was also using the replaceUrl option. If this is not desirable, the redirect can configure new NavigationBehaviorOptions by returning a RedirectCommand with the desired options instead of UrlTree.

compiler

| Commit | Type | Description | | -- | -- | -- | | 7fc7f3f05f | fix | capture all control flow branches for content projection in if blocks (#54921) | | a369f43fbd | fix | capture switch block cases for content projection (#54921) | | eb625d3783 | fix | declare for loop aliases in addition to new name (#54942) | | bfd0bd574e | fix | invoke method-based tracking function with context (#54960) | | e1650e3b13 | fix | throw error if item name and context variables conflict (#55045) |

compiler-cli

| Commit | Type | Description | | -- | -- | -- | | 5bd188a394 | feat | add partial compilation support for deferred blocks (#54908) | | b02b31a915 | feat | drop support for TypeScript older than 5.4 (#54961) | | 78188e877a | fix | add diagnostic if initializer API is used outside of an initializer (#54993) | | 694ba79cbf | fix | report cases where initializer APIs are used in a non-directive class (#54993) | | 6219341d26 | fix | report errors when initializer APIs are used on private fields (#54981) |

core

| Commit | Type | Description | | -- | -- | -- | | a600a39d0c | feat | add support for fallback content in ng-content (#54854) | | 658cf8c384 | fix | ComponentFixture stability should match ApplicationRef (#54949) | | 2fc11eae9e | fix | account for re-projected ng-content elements with fallback content (#54854) | | 1c0ec56c46 | fix | correctly project single-root content inside control flow (#54921) | | 86a359b399 | fix | establish proper injector resolution order for @defer blocks (#55079) | | e02bcf89cf | fix | Fix clearing of pending task in zoneless cleanup implementation (#55074) |

http

| Commit | Type | Description | | -- | -- | -- | | cf73983fdc | fix | include transferCache when cloning HttpRequest (#54939) | | 13554f9637 | fix | manage different body types for caching POST requests (#54980) |

language-service

| Commit | Type | Description | | -- | -- | -- | | 6d1b82df32 | fix | allow external projects to use provided compiler options (#55035) | | 4166dfc1b6 | fix | prevent underlying TS Service from handling template files (#55003) |

migrations

| Commit | Type | Description | | -- | -- | -- | | 63688714ae | fix | account for variables in imports initializer (#55081) |

router

| Commit | Type | Description | | -- | -- | -- | | 60f1d681e0 | fix | preserve replaceUrl when returning a urlTree from CanActivate (#54042) | | eae75ff3f9 | fix | RouterLinkActive will always remove active classes when links are not active (#54982) |

<!-- CHANGELOG SPLIT MARKER -->

<a name="17.3.2"></a>

Readme

Source

Angular

The sources for this package are in the main Angular repo. Please file issues and pull requests against that repo.

Usage information and reference details can be found in Angular documentation.

License: MIT

FAQs

Last updated on 28 Mar 2024

Did you know?

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc