9d265b6f61
Closes #9732 BREAKING CHANGE: We have removed the deprecated form directives from the built-in platform directive list, so apps are not required to package forms with their app. This also makes forms friendly to offline compilation. Instead, we have exposed three modules: OLD API: - `DeprecatedFormsModule` NEW API: - `FormsModule` - `ReactiveFormsModule` If you provide one of these modules, the default forms directives and providers from that module will be available to you app-wide. Note: You can provide both the `FormsModule` and the `ReactiveFormsModule` together if you like, but they are fully-functional separately. **Before:** ```ts import {disableDeprecatedForms, provideForms} from @angular/forms; bootstrap(App, [ disableDeprecatedForms(), provideForms() ]); ``` **After:** ```ts import {DeprecatedFormsModule} from @angular/common; bootstrap(App, {modules: [DeprecatedFormsModule] }); ``` -OR- ```ts import {FormsModule} from @angular/forms; bootstrap(App, {modules: [FormsModule] }); ``` -OR- ```ts import {ReactiveFormsModule} from @angular/forms; bootstrap(App, {modules: [ReactiveFormsModule] }); ``` You can also choose not to provide any forms module and run your app without forms. Or you can choose not to provide any forms module *and* provide form directives at will. This will allow you to use the deprecatedForms API for some components and not others. ``` import {FORM_DIRECTIVES, FORM_PROVIDERS} from @angular/forms; @Component({ selector: some-comp, directives: [FORM_DIRECTIVES], providers: [FORM_PROVIDERS] }) class SomeComp ```
86 lines
4.1 KiB
TypeScript
86 lines
4.1 KiB
TypeScript
/**
|
|
* @license
|
|
* Copyright Google Inc. All Rights Reserved.
|
|
*
|
|
* Use of this source code is governed by an MIT-style license that can be
|
|
* found in the LICENSE file at https://angular.io/license
|
|
*/
|
|
|
|
import {Type} from '@angular/core';
|
|
|
|
import {CheckboxControlValueAccessor} from './directives/checkbox_value_accessor';
|
|
import {DefaultValueAccessor} from './directives/default_value_accessor';
|
|
import {NgControlStatus} from './directives/ng_control_status';
|
|
import {NgForm} from './directives/ng_form';
|
|
import {NgModel} from './directives/ng_model';
|
|
import {NgModelGroup} from './directives/ng_model_group';
|
|
import {NumberValueAccessor} from './directives/number_value_accessor';
|
|
import {RadioControlValueAccessor} from './directives/radio_control_value_accessor';
|
|
import {FormArrayName} from './directives/reactive_directives/form_array_name';
|
|
import {FormControlDirective} from './directives/reactive_directives/form_control_directive';
|
|
import {FormControlName} from './directives/reactive_directives/form_control_name';
|
|
import {FormGroupDirective} from './directives/reactive_directives/form_group_directive';
|
|
import {FormGroupName} from './directives/reactive_directives/form_group_name';
|
|
import {NgSelectOption, SelectControlValueAccessor} from './directives/select_control_value_accessor';
|
|
import {NgSelectMultipleOption, SelectMultipleControlValueAccessor} from './directives/select_multiple_control_value_accessor';
|
|
import {MaxLengthValidator, MinLengthValidator, PatternValidator, RequiredValidator} from './directives/validators';
|
|
|
|
export {CheckboxControlValueAccessor} from './directives/checkbox_value_accessor';
|
|
export {ControlValueAccessor} from './directives/control_value_accessor';
|
|
export {DefaultValueAccessor} from './directives/default_value_accessor';
|
|
export {NgControl} from './directives/ng_control';
|
|
export {NgControlStatus} from './directives/ng_control_status';
|
|
export {NgForm} from './directives/ng_form';
|
|
export {NgModel} from './directives/ng_model';
|
|
export {NgModelGroup} from './directives/ng_model_group';
|
|
export {NumberValueAccessor} from './directives/number_value_accessor';
|
|
export {RadioControlValueAccessor} from './directives/radio_control_value_accessor';
|
|
export {FormArrayName} from './directives/reactive_directives/form_array_name';
|
|
export {FormControlDirective} from './directives/reactive_directives/form_control_directive';
|
|
export {FormControlName} from './directives/reactive_directives/form_control_name';
|
|
export {FormGroupDirective} from './directives/reactive_directives/form_group_directive';
|
|
export {FormGroupName} from './directives/reactive_directives/form_group_name';
|
|
export {NgSelectOption, SelectControlValueAccessor} from './directives/select_control_value_accessor';
|
|
export {NgSelectMultipleOption, SelectMultipleControlValueAccessor} from './directives/select_multiple_control_value_accessor';
|
|
export {MaxLengthValidator, MinLengthValidator, PatternValidator, RequiredValidator} from './directives/validators';
|
|
|
|
const SHARED_FORM_DIRECTIVES: Type[] = /*@ts2dart_const*/[
|
|
NgSelectOption, NgSelectMultipleOption, DefaultValueAccessor, NumberValueAccessor,
|
|
CheckboxControlValueAccessor, SelectControlValueAccessor, SelectMultipleControlValueAccessor,
|
|
RadioControlValueAccessor, NgControlStatus, RequiredValidator, MinLengthValidator,
|
|
MaxLengthValidator, PatternValidator
|
|
];
|
|
|
|
const TEMPLATE_DRIVEN_DIRECTIVES: Type[] = /*@ts2dart_const*/[NgModel, NgModelGroup, NgForm];
|
|
|
|
const REACTIVE_DRIVEN_DIRECTIVES: Type[] = /*@ts2dart_const*/[
|
|
FormControlDirective, FormGroupDirective, FormControlName, FormGroupName, FormArrayName
|
|
];
|
|
|
|
/**
|
|
*
|
|
* A list of all the form directives used as part of a `@Component` annotation.
|
|
*
|
|
* This is a shorthand for importing them each individually.
|
|
*
|
|
* ### Example
|
|
*
|
|
* ```typescript
|
|
* @Component({
|
|
* selector: 'my-app',
|
|
* directives: [FORM_DIRECTIVES]
|
|
* })
|
|
* class MyApp {}
|
|
* ```
|
|
* @experimental
|
|
*/
|
|
export const FORM_DIRECTIVES: Type[][] =
|
|
/*@ts2dart_const*/[TEMPLATE_DRIVEN_DIRECTIVES, SHARED_FORM_DIRECTIVES];
|
|
|
|
/**
|
|
* @experimental
|
|
*/
|
|
|
|
export const REACTIVE_FORM_DIRECTIVES: Type[][] =
|
|
/*@ts2dart_const*/[REACTIVE_DRIVEN_DIRECTIVES, SHARED_FORM_DIRECTIVES];
|