@ngx-formly/material 10.0.1 → 11.1.0-rc.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +107 -177
- package/fesm2022/ngx-formly-material-checkbox.mjs +234 -127
- package/fesm2022/ngx-formly-material-checkbox.mjs.map +1 -1
- package/fesm2022/ngx-formly-material-datepicker.mjs +264 -118
- package/fesm2022/ngx-formly-material-datepicker.mjs.map +1 -1
- package/fesm2022/ngx-formly-material-form-field.mjs +440 -226
- package/fesm2022/ngx-formly-material-form-field.mjs.map +1 -1
- package/fesm2022/ngx-formly-material-input.mjs +199 -89
- package/fesm2022/ngx-formly-material-input.mjs.map +1 -1
- package/fesm2022/ngx-formly-material-multicheckbox.mjs +203 -106
- package/fesm2022/ngx-formly-material-multicheckbox.mjs.map +1 -1
- package/fesm2022/ngx-formly-material-native-select.mjs +204 -73
- package/fesm2022/ngx-formly-material-native-select.mjs.map +1 -1
- package/fesm2022/ngx-formly-material-radio.mjs +247 -104
- package/fesm2022/ngx-formly-material-radio.mjs.map +1 -1
- package/fesm2022/ngx-formly-material-select.mjs +318 -133
- package/fesm2022/ngx-formly-material-select.mjs.map +1 -1
- package/fesm2022/ngx-formly-material-slider.mjs +195 -85
- package/fesm2022/ngx-formly-material-slider.mjs.map +1 -1
- package/fesm2022/ngx-formly-material-textarea.mjs +203 -86
- package/fesm2022/ngx-formly-material-textarea.mjs.map +1 -1
- package/fesm2022/ngx-formly-material-toggle.mjs +208 -86
- package/fesm2022/ngx-formly-material-toggle.mjs.map +1 -1
- package/fesm2022/ngx-formly-material.mjs +84 -62
- package/fesm2022/ngx-formly-material.mjs.map +1 -1
- package/package.json +3 -3
- package/types/ngx-formly-material-checkbox.d.ts +41 -46
- package/types/ngx-formly-material-datepicker.d.ts +62 -67
- package/types/ngx-formly-material-form-field.d.ts +71 -77
- package/types/ngx-formly-material-input.d.ts +22 -28
- package/types/ngx-formly-material-multicheckbox.d.ts +33 -38
- package/types/ngx-formly-material-native-select.d.ts +23 -29
- package/types/ngx-formly-material-radio.d.ts +34 -39
- package/types/ngx-formly-material-select.d.ts +45 -48
- package/types/ngx-formly-material-slider.d.ts +32 -37
- package/types/ngx-formly-material-textarea.d.ts +28 -33
- package/types/ngx-formly-material-toggle.d.ts +30 -35
- package/types/ngx-formly-material.d.ts +16 -19
package/README.md
CHANGED
|
@@ -1,180 +1,110 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
- [
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
1
|
+
# @ngx-formly/material
|
|
2
|
+
|
|
3
|
+
Angular Material field types and wrappers for Formly. This adapter uses Material controls and `mat-form-field` for labels, hints, and validation messages.
|
|
4
|
+
|
|
5
|
+
## Installation
|
|
6
|
+
|
|
7
|
+
For Formly 11, use Angular 22 or newer and Angular Material 22 or newer. Keep all `@ngx-formly/*` packages on the same version, and use an `@angular/forms` version matching your application.
|
|
8
|
+
|
|
9
|
+
In an Angular application with Reactive Forms installed:
|
|
10
|
+
|
|
11
|
+
```sh
|
|
12
|
+
npm install @ngx-formly/core@^11 @ngx-formly/material@^11 @angular/material@^22 @angular/cdk@^22
|
|
13
|
+
```
|
|
14
|
+
|
|
15
|
+
Configure an Angular Material theme in your application. For example, add `node_modules/@angular/material/prebuilt-themes/azure-blue.css` to the build target's `styles` array in `angular.json`. See the [Material setup guide](https://material.angular.dev/guide/getting-started) for application setup.
|
|
16
|
+
|
|
17
|
+
## Configuration
|
|
18
|
+
|
|
19
|
+
Add the adapter to your application providers in `app.config.ts`:
|
|
20
|
+
|
|
21
|
+
```ts
|
|
22
|
+
import { ApplicationConfig } from '@angular/core';
|
|
23
|
+
import { provideFormlyCore } from '@ngx-formly/core';
|
|
24
|
+
import { withFormlyMaterial } from '@ngx-formly/material';
|
|
25
|
+
|
|
26
|
+
export const appConfig: ApplicationConfig = {
|
|
27
|
+
providers: [provideFormlyCore(withFormlyMaterial())],
|
|
28
|
+
};
|
|
29
|
+
```
|
|
30
|
+
|
|
31
|
+
## Usage
|
|
32
|
+
|
|
33
|
+
This field renders an email input using Angular Material:
|
|
34
|
+
|
|
35
|
+
```ts
|
|
36
|
+
import { Component } from '@angular/core';
|
|
37
|
+
import { FormGroup, ReactiveFormsModule } from '@angular/forms';
|
|
38
|
+
import { FormlyFieldConfig, FormlyForm } from '@ngx-formly/core';
|
|
39
|
+
|
|
40
|
+
@Component({
|
|
41
|
+
selector: 'app-example',
|
|
42
|
+
imports: [ReactiveFormsModule, FormlyForm],
|
|
43
|
+
template: `
|
|
44
|
+
<form [formGroup]="form">
|
|
45
|
+
<formly-form [form]="form" [fields]="fields" [model]="model"></formly-form>
|
|
46
|
+
</form>
|
|
47
|
+
`,
|
|
48
|
+
})
|
|
49
|
+
export class ExampleComponent {
|
|
50
|
+
form = new FormGroup({});
|
|
51
|
+
model = { email: '' };
|
|
52
|
+
fields: FormlyFieldConfig[] = [
|
|
53
|
+
{
|
|
54
|
+
key: 'email',
|
|
55
|
+
type: 'input',
|
|
56
|
+
props: { type: 'email', label: 'Email', required: true },
|
|
57
|
+
},
|
|
58
|
+
];
|
|
59
|
+
}
|
|
60
|
+
```
|
|
61
|
+
|
|
62
|
+
## Field types
|
|
63
|
+
|
|
64
|
+
`withFormlyMaterial()` registers `input`, `textarea`, `checkbox`, `multicheckbox`, `radio`, and `select`, together with their form-field wrapper.
|
|
65
|
+
|
|
66
|
+
Register these additional controls separately:
|
|
67
|
+
|
|
68
|
+
| Field type | Import | Registration |
|
|
69
|
+
| --------------- | ------------------------------------ | ------------------------------- |
|
|
70
|
+
| `datepicker` | `@ngx-formly/material/datepicker` | `withFormlyFieldDatepicker()` |
|
|
71
|
+
| `native-select` | `@ngx-formly/material/native-select` | `withFormlyFieldNativeSelect()` |
|
|
72
|
+
| `slider` | `@ngx-formly/material/slider` | `withFormlyFieldSlider()` |
|
|
73
|
+
| `toggle` | `@ngx-formly/material/toggle` | `withFormlyFieldToggle()` |
|
|
74
|
+
|
|
75
|
+
For a datepicker with JavaScript `Date` values, use this application configuration:
|
|
76
|
+
|
|
77
|
+
```ts
|
|
78
|
+
import { ApplicationConfig } from '@angular/core';
|
|
79
|
+
import { provideNativeDateAdapter } from '@angular/material/core';
|
|
80
|
+
import { provideFormlyCore } from '@ngx-formly/core';
|
|
81
|
+
import { withFormlyMaterial } from '@ngx-formly/material';
|
|
82
|
+
import { withFormlyFieldDatepicker } from '@ngx-formly/material/datepicker';
|
|
83
|
+
|
|
84
|
+
export const appConfig: ApplicationConfig = {
|
|
85
|
+
providers: [provideNativeDateAdapter(), provideFormlyCore([...withFormlyMaterial(), withFormlyFieldDatepicker()])],
|
|
86
|
+
};
|
|
87
|
+
```
|
|
88
|
+
|
|
89
|
+
## Which Version to use?
|
|
90
|
+
|
|
91
|
+
Match `@ngx-formly/material` to your `@ngx-formly/core` version, and check the migration guide for UI library requirements.
|
|
66
92
|
|
|
67
93
|
| Angular version | Formly version | Migration |
|
|
68
94
|
| --------------- | -------------------- | ---------------------------------- |
|
|
69
|
-
| Angular >=
|
|
70
|
-
| Angular >=
|
|
71
|
-
| Angular >=
|
|
72
|
-
| Angular >=
|
|
73
|
-
| Angular >=
|
|
74
|
-
| Angular >=
|
|
75
|
-
| Angular >=
|
|
76
|
-
| Angular >=
|
|
77
|
-
| Angular >=
|
|
78
|
-
| Angular >=
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
their respective UI libraries. Kendo requires version 21.4.1 or newer, and NativeScript
|
|
86
|
-
requires `@nativescript/angular` 21 or newer. Applications staying on Angular 20 should use Formly v9.
|
|
87
|
-
|
|
88
|
-
See the [v10 upgrade guide](UPGRADE-10.0.md) for migration steps.
|
|
89
|
-
|
|
90
|
-
#### Upgrading to v9
|
|
91
|
-
|
|
92
|
-
Formly v9 requires Angular 20 or newer. Upgrade Angular first, then update all
|
|
93
|
-
`@ngx-formly/*` packages used by your application together to v9.
|
|
94
|
-
The Material, PrimeNG, and NG-ZORRO integrations require version 20 or newer of
|
|
95
|
-
their respective UI libraries. Kendo requires version 19.1 or newer, and NativeScript
|
|
96
|
-
requires `@nativescript/angular` 20 or newer. Applications staying on Angular 19 should
|
|
97
|
-
use Formly v8; applications staying on Angular 18 should use Formly v7.
|
|
98
|
-
|
|
99
|
-
PrimeNG datepicker fields no longer accept `monthNavigator`, `yearNavigator`, or
|
|
100
|
-
`yearRange`, which PrimeNG 20 removed. Replace `@primeng/themes` imports with
|
|
101
|
-
`@primeuix/themes` when configuring a PrimeNG theme.
|
|
102
|
-
|
|
103
|
-
See the [v9 upgrade guide](UPGRADE-9.0.md) for migration steps and the [changelog](CHANGELOG.md) for the full list of changes.
|
|
104
|
-
|
|
105
|
-
## Core Team
|
|
106
|
-
|
|
107
|
-
<table>
|
|
108
|
-
<tr>
|
|
109
|
-
<td align="center">
|
|
110
|
-
<a href="https://github.com/aitboudad">
|
|
111
|
-
<img src="https://avatars.githubusercontent.com/u/1753742?v=3" width="100px;" />
|
|
112
|
-
<br />
|
|
113
|
-
<sub><b>Abdellatif Ait boudad</b></sub>
|
|
114
|
-
</a>
|
|
115
|
-
</td>
|
|
116
|
-
<td align="center">
|
|
117
|
-
<a href="https://juri.dev">
|
|
118
|
-
<img src="https://avatars.githubusercontent.com/u/542458" width="100px;" />
|
|
119
|
-
<br />
|
|
120
|
-
<sub><b>Juri Strumpflohner</b></sub>
|
|
121
|
-
</a>
|
|
122
|
-
</td>
|
|
123
|
-
<td align="center">
|
|
124
|
-
<a href="https://github.com/mohammedzamakhan">
|
|
125
|
-
<img src="https://avatars.githubusercontent.com/u/2327532" width="100px;" />
|
|
126
|
-
<br />
|
|
127
|
-
<sub><b>Mohammed Zama Khan</b></sub>
|
|
128
|
-
</a>
|
|
129
|
-
</td>
|
|
130
|
-
<td align="center">
|
|
131
|
-
<a href="https://github.com/beeman">
|
|
132
|
-
<img src="https://avatars.githubusercontent.com/u/36491" width="100px;" />
|
|
133
|
-
<br />
|
|
134
|
-
<sub><b>Bram Borggreve</b></sub>
|
|
135
|
-
</a>
|
|
136
|
-
</td>
|
|
137
|
-
<td align="center">
|
|
138
|
-
<a href="https://github.com/kenisteward">
|
|
139
|
-
<img src="https://avatars.githubusercontent.com/u/12831669" width="100px;" />
|
|
140
|
-
<br />
|
|
141
|
-
<sub><b>Keni Steward</b></sub>
|
|
142
|
-
</a>
|
|
143
|
-
</td>
|
|
144
|
-
<td align="center">
|
|
145
|
-
<a href="https://github.com/MaxKless">
|
|
146
|
-
<img src="https://avatars.githubusercontent.com/u/34165455" width="100px;" />
|
|
147
|
-
<br />
|
|
148
|
-
<sub><b>Max Kless</b></sub>
|
|
149
|
-
</a>
|
|
150
|
-
</td>
|
|
151
|
-
</tr>
|
|
152
|
-
</table>
|
|
153
|
-
|
|
154
|
-
## Contributors
|
|
155
|
-
|
|
156
|
-
Thanks goes to these wonderful people:
|
|
157
|
-
|
|
158
|
-
<!-- ALL-CONTRIBUTORS-LIST:START - Do not remove or modify this section -->
|
|
159
|
-
[<img alt="aitboudad" src="https://avatars.githubusercontent.com/u/1753742?v=4&s=80" width="80"/>](https://github.com/aitboudad)[<img alt="mohammedzamakhan" src="https://avatars.githubusercontent.com/u/2327532?v=4&s=80" width="80"/>](https://github.com/mohammedzamakhan)[<img alt="divyakumarjain" src="https://avatars.githubusercontent.com/u/2039134?v=4&s=80" width="80"/>](https://github.com/divyakumarjain)[<img alt="MaxKless" src="https://avatars.githubusercontent.com/u/34165455?v=4&s=80" width="80"/>](https://github.com/MaxKless)[<img alt="couzic" src="https://avatars.githubusercontent.com/u/1380322?v=4&s=80" width="80"/>](https://github.com/couzic)[<img alt="juristr" src="https://avatars.githubusercontent.com/u/542458?v=4&s=80" width="80"/>](https://github.com/juristr)[<img alt="franzeal" src="https://avatars.githubusercontent.com/u/7455769?v=4&s=80" width="80"/>](https://github.com/franzeal)[<img alt="beeman" src="https://avatars.githubusercontent.com/u/36491?v=4&s=80" width="80"/>](https://github.com/beeman)
|
|
160
|
-
|
|
161
|
-
[<img alt="kenisteward" src="https://avatars.githubusercontent.com/u/12831669?v=4&s=80" width="80"/>](https://github.com/kenisteward)[<img alt="thorgod" src="https://avatars.githubusercontent.com/u/13910170?v=4&s=80" width="80"/>](https://github.com/thorgod)[<img alt="samtsai" src="https://avatars.githubusercontent.com/u/225526?v=4&s=80" width="80"/>](https://github.com/samtsai)[<img alt="luizfbicalho" src="https://avatars.githubusercontent.com/u/16882855?v=4&s=80" width="80"/>](https://github.com/luizfbicalho)[<img alt="klemenoslaj" src="https://avatars.githubusercontent.com/u/7548247?v=4&s=80" width="80"/>](https://github.com/klemenoslaj)[<img alt="FritzHerbers" src="https://avatars.githubusercontent.com/u/10029682?v=4&s=80" width="80"/>](https://github.com/FritzHerbers)[<img alt="dev-kanishk" src="https://avatars.githubusercontent.com/u/48204976?v=4&s=80" width="80"/>](https://github.com/dev-kanishk)[<img alt="vstiebe" src="https://avatars.githubusercontent.com/u/13326475?v=4&s=80" width="80"/>](https://github.com/vstiebe)
|
|
162
|
-
|
|
163
|
-
[<img alt="rpw1" src="https://avatars.githubusercontent.com/u/47835461?v=4&s=80" width="80"/>](https://github.com/rpw1)[<img alt="Devqon" src="https://avatars.githubusercontent.com/u/9316480?v=4&s=80" width="80"/>](https://github.com/Devqon)[<img alt="ryanjerskine" src="https://avatars.githubusercontent.com/u/5464778?v=4&s=80" width="80"/>](https://github.com/ryanjerskine)[<img alt="rehleinBo" src="https://avatars.githubusercontent.com/u/7338819?v=4&s=80" width="80"/>](https://github.com/rehleinBo)[<img alt="MarcosEllys" src="https://avatars.githubusercontent.com/u/6751242?v=4&s=80" width="80"/>](https://github.com/MarcosEllys)[<img alt="manuelmeister" src="https://avatars.githubusercontent.com/u/3001985?v=4&s=80" width="80"/>](https://github.com/manuelmeister)[<img alt="dolphinigle" src="https://avatars.githubusercontent.com/u/7020472?v=4&s=80" width="80"/>](https://github.com/dolphinigle)[<img alt="Lehoczky" src="https://avatars.githubusercontent.com/u/31937175?v=4&s=80" width="80"/>](https://github.com/Lehoczky)
|
|
164
|
-
|
|
165
|
-
[<img alt="Krustie101" src="https://avatars.githubusercontent.com/u/1636728?v=4&s=80" width="80"/>](https://github.com/Krustie101)[<img alt="intellix" src="https://avatars.githubusercontent.com/u/1162531?v=4&s=80" width="80"/>](https://github.com/intellix)[<img alt="skrtheboss" src="https://avatars.githubusercontent.com/u/10209728?v=4&s=80" width="80"/>](https://github.com/skrtheboss)[<img alt="dwaldrum" src="https://avatars.githubusercontent.com/u/386721?v=4&s=80" width="80"/>](https://github.com/dwaldrum)[<img alt="json-derulo" src="https://avatars.githubusercontent.com/u/18580672?v=4&s=80" width="80"/>](https://github.com/json-derulo)[<img alt="atsjo" src="https://avatars.githubusercontent.com/u/16601899?v=4&s=80" width="80"/>](https://github.com/atsjo)[<img alt="Cselt" src="https://avatars.githubusercontent.com/u/11027521?v=4&s=80" width="80"/>](https://github.com/Cselt)[<img alt="blowsie" src="https://avatars.githubusercontent.com/u/308572?v=4&s=80" width="80"/>](https://github.com/blowsie)
|
|
166
|
-
|
|
167
|
-
[<img alt="roshan-sama" src="https://avatars.githubusercontent.com/u/31125563?v=4&s=80" width="80"/>](https://github.com/roshan-sama)[<img alt="rternavskyi" src="https://avatars.githubusercontent.com/u/26190424?v=4&s=80" width="80"/>](https://github.com/rternavskyi)[<img alt="milasevicius" src="https://avatars.githubusercontent.com/u/1790265?v=4&s=80" width="80"/>](https://github.com/milasevicius)[<img alt="13dante04" src="https://avatars.githubusercontent.com/u/25120620?v=4&s=80" width="80"/>](https://github.com/13dante04)[<img alt="Riron" src="https://avatars.githubusercontent.com/u/5145523?v=4&s=80" width="80"/>](https://github.com/Riron)[<img alt="rbalet" src="https://avatars.githubusercontent.com/u/44493964?v=4&s=80" width="80"/>](https://github.com/rbalet)[<img alt="rafaelss95" src="https://avatars.githubusercontent.com/u/11965907?v=4&s=80" width="80"/>](https://github.com/rafaelss95)[<img alt="rammba" src="https://avatars.githubusercontent.com/u/40705899?v=4&s=80" width="80"/>](https://github.com/rammba)
|
|
168
|
-
|
|
169
|
-
[<img alt="Pouja" src="https://avatars.githubusercontent.com/u/2385144?v=4&s=80" width="80"/>](https://github.com/Pouja)[<img alt="OmkarJ13" src="https://avatars.githubusercontent.com/u/65808188?v=4&s=80" width="80"/>](https://github.com/OmkarJ13)[<img alt="NanFengCheong" src="https://avatars.githubusercontent.com/u/7321833?v=4&s=80" width="80"/>](https://github.com/NanFengCheong)[<img alt="Tom-V" src="https://avatars.githubusercontent.com/u/322654?v=4&s=80" width="80"/>](https://github.com/Tom-V)[<img alt="VyacheslavPritykin" src="https://avatars.githubusercontent.com/u/819457?v=4&s=80" width="80"/>](https://github.com/VyacheslavPritykin)[<img alt="akamyshanov" src="https://avatars.githubusercontent.com/u/1358330?v=4&s=80" width="80"/>](https://github.com/akamyshanov)[<img alt="danielcrisp" src="https://avatars.githubusercontent.com/u/1104814?v=4&s=80" width="80"/>](https://github.com/danielcrisp)[<img alt="francisco-sanchez-molina" src="https://avatars.githubusercontent.com/u/9049706?v=4&s=80" width="80"/>](https://github.com/francisco-sanchez-molina)
|
|
170
|
-
|
|
171
|
-
[<img alt="jazpearson" src="https://avatars.githubusercontent.com/u/7648154?v=4&s=80" width="80"/>](https://github.com/jazpearson)[<img alt="kapsiR" src="https://avatars.githubusercontent.com/u/7165033?v=4&s=80" width="80"/>](https://github.com/kapsiR)[<img alt="marfer" src="https://avatars.githubusercontent.com/u/1127166?v=4&s=80" width="80"/>](https://github.com/marfer)[<img alt="mburger81" src="https://avatars.githubusercontent.com/u/3778892?v=4&s=80" width="80"/>](https://github.com/mburger81)[<img alt="n3xus" src="https://avatars.githubusercontent.com/u/510213?v=4&s=80" width="80"/>](https://github.com/n3xus)[<img alt="neminovno" src="https://avatars.githubusercontent.com/u/1468887?v=4&s=80" width="80"/>](https://github.com/neminovno)[<img alt="sesidhar01" src="https://avatars.githubusercontent.com/u/61068911?v=4&s=80" width="80"/>](https://github.com/sesidhar01)[<img alt="vezzoo" src="https://avatars.githubusercontent.com/u/28898894?v=4&s=80" width="80"/>](https://github.com/vezzoo)
|
|
172
|
-
|
|
173
|
-
[<img alt="wenqi73" src="https://avatars.githubusercontent.com/u/23337087?v=4&s=80" width="80"/>](https://github.com/wenqi73)[<img alt="yoni333" src="https://avatars.githubusercontent.com/u/19931760?v=4&s=80" width="80"/>](https://github.com/yoni333)[<img alt="AlexTalcura" src="https://avatars.githubusercontent.com/u/20095773?v=4&s=80" width="80"/>](https://github.com/AlexTalcura)[<img alt="alex-novikov-1990" src="https://avatars.githubusercontent.com/u/6377930?v=4&s=80" width="80"/>](https://github.com/alex-novikov-1990)[<img alt="alvarolb" src="https://avatars.githubusercontent.com/u/1141353?v=4&s=80" width="80"/>](https://github.com/alvarolb)[<img alt="andmoredev" src="https://avatars.githubusercontent.com/u/33256364?v=4&s=80" width="80"/>](https://github.com/andmoredev)[<img alt="vitale232" src="https://avatars.githubusercontent.com/u/8504254?v=4&s=80" width="80"/>](https://github.com/vitale232)[<img alt="AmGarera" src="https://avatars.githubusercontent.com/u/6021169?v=4&s=80" width="80"/>](https://github.com/AmGarera)
|
|
174
|
-
|
|
175
|
-
[<img alt="atsjo" src="https://avatars.githubusercontent.com/u/16601899?v=4&s=80" width="80"/>](https://github.com/atsjo)[<img alt="bhaidar" src="https://avatars.githubusercontent.com/u/1163421?v=4&s=80" width="80"/>](https://github.com/bhaidar)[<img alt="cyrilletuzi" src="https://avatars.githubusercontent.com/u/555867?v=4&s=80" width="80"/>](https://github.com/cyrilletuzi)[<img alt="json-derulo" src="https://avatars.githubusercontent.com/u/18580672?v=4&s=80" width="80"/>](https://github.com/json-derulo)[<img alt="Dayvisson" src="https://avatars.githubusercontent.com/u/12189515?v=4&s=80" width="80"/>](https://github.com/Dayvisson)[<img alt="dereekb" src="https://avatars.githubusercontent.com/u/3586580?v=4&s=80" width="80"/>](https://github.com/dereekb)[<img alt="eduardoRoth" src="https://avatars.githubusercontent.com/u/5419161?v=4&s=80" width="80"/>](https://github.com/eduardoRoth)[<img alt="enricouniurb" src="https://avatars.githubusercontent.com/u/38656571?v=4&s=80" width="80"/>](https://github.com/enricouniurb)
|
|
176
|
-
|
|
177
|
-
[<img alt="erikvdv1" src="https://avatars.githubusercontent.com/u/2014802?v=4&s=80" width="80"/>](https://github.com/erikvdv1)[<img alt="fynnfeldpausch" src="https://avatars.githubusercontent.com/u/1246913?v=4&s=80" width="80"/>](https://github.com/fynnfeldpausch)[<img alt="jrgleason" src="https://avatars.githubusercontent.com/u/1319151?v=4&s=80" width="80"/>](https://github.com/jrgleason)[<img alt="johannesjo" src="https://avatars.githubusercontent.com/u/1456265?v=4&s=80" width="80"/>](https://github.com/johannesjo)[<img alt="johndbell" src="https://avatars.githubusercontent.com/u/1931322?v=4&s=80" width="80"/>](https://github.com/johndbell)[<img alt="jdpnielsen" src="https://avatars.githubusercontent.com/u/8746698?v=4&s=80" width="80"/>](https://github.com/jdpnielsen)[<img alt="TheMcMurder" src="https://avatars.githubusercontent.com/u/3059715?v=4&s=80" width="80"/>](https://github.com/TheMcMurder)[<img alt="LennardWesterveld" src="https://avatars.githubusercontent.com/u/1076589?v=4&s=80" width="80"/>](https://github.com/LennardWesterveld)
|
|
178
|
-
|
|
179
|
-
[<img alt="logvinoleg89" src="https://avatars.githubusercontent.com/u/12018303?v=4&s=80" width="80"/>](https://github.com/logvinoleg89)[<img alt="LucasJAlba" src="https://avatars.githubusercontent.com/u/2780076?v=4&s=80" width="80"/>](https://github.com/LucasJAlba)[<img alt="lucienbertin" src="https://avatars.githubusercontent.com/u/10089239?v=4&s=80" width="80"/>](https://github.com/lucienbertin)[<img alt="luizbicalhoagl" src="https://avatars.githubusercontent.com/u/93284446?v=4&s=80" width="80"/>](https://github.com/luizbicalhoagl)[<img alt="waffle-iron" src="https://avatars.githubusercontent.com/u/6912981?v=4&s=80" width="80"/>](https://github.com/waffle-iron)[<img alt="mathijshoogland" src="https://avatars.githubusercontent.com/u/7372934?v=4&s=80" width="80"/>](https://github.com/mathijshoogland)[<img alt="mrbusche" src="https://avatars.githubusercontent.com/u/792378?v=4&s=80" width="80"/>](https://github.com/mrbusche)[<img alt="mehranmb78" src="https://avatars.githubusercontent.com/u/144687844?v=4&s=80" width="80"/>](https://github.com/mehranmb78)
|
|
180
|
-
<!-- ALL-CONTRIBUTORS-LIST:END -->
|
|
95
|
+
| Angular >= 22 | `@ngx-formly/material@11.x` | [Upgrade to v11](https://github.com/ngx-formly/ngx-formly/blob/main/UPGRADE-11.0.md) |
|
|
96
|
+
| Angular >= 21 | `@ngx-formly/material@10.x` | [Upgrade to v10](https://github.com/ngx-formly/ngx-formly/blob/main/UPGRADE-10.0.md) |
|
|
97
|
+
| Angular >= 20 | `@ngx-formly/material@9.x` | [Upgrade to v9](https://github.com/ngx-formly/ngx-formly/blob/main/UPGRADE-9.0.md) |
|
|
98
|
+
| Angular >= 19 | `@ngx-formly/material@8.x` | [Upgrade to v8](https://github.com/ngx-formly/ngx-formly/blob/main/UPGRADE-8.0.md) |
|
|
99
|
+
| Angular >= 18 | `@ngx-formly/material@7.x` | [Upgrade to v7](https://github.com/ngx-formly/ngx-formly/blob/main/UPGRADE-7.0.md) |
|
|
100
|
+
| Angular >= 13 | `@ngx-formly/material@6.x` | [Upgrade to v6](https://github.com/ngx-formly/ngx-formly/blob/main/UPGRADE-6.0.md) |
|
|
101
|
+
| Angular >= 7 | `@ngx-formly/material@5.x` | [Upgrade to v5](https://github.com/ngx-formly/ngx-formly/blob/main/UPGRADE-5.0.md) |
|
|
102
|
+
| Angular >= 6 | `@ngx-formly/material@4.x` | |
|
|
103
|
+
| Angular >= 5 | `@ngx-formly/material@3.x` | |
|
|
104
|
+
| Angular >= 4 | `@ngx-formly/material@2.x` | [Upgrade to v2](https://github.com/ngx-formly/ngx-formly/blob/main/UPGRADE-2.0.md) |
|
|
105
|
+
|
|
106
|
+
## Documentation
|
|
107
|
+
|
|
108
|
+
- [Angular Material examples](https://formly.dev/ui/material)
|
|
109
|
+
- [Formly guide](https://formly.dev/guide)
|
|
110
|
+
- [Source](https://github.com/ngx-formly/ngx-formly/tree/main/src/ui/material)
|