Questions tagged [ngx-formly]

ngx-formly is an Angular module which automatically generate Angular reactive form from Formly as well as JSON schema.

Filter by
Sorted by
Tagged with
0 votes
0 answers
13 views

Angular Formly repeat section - Async model. Not working

I'm trying to create a custom repeat type for formly (for file uploads) that takes in a certain number of fields received from the server. I'm not sure I'm being clear but overall the "...
Martin Carre's user avatar
  • 1,165
-1 votes
1 answer
27 views

Angular Formly Form hook OnInit -> field.xxx is possibly undefined

Angular version: 16.0 Formly version: 6.1.8 I'd need to create a cascated select for my app. The first field is a Material Autocomplete and then the next one a simple select I'm struggling, however, ...
Martin Carre's user avatar
  • 1,165
0 votes
0 answers
23 views

Formly select from observable and server data doesn't show the value

I'm trying to have a formly select field display the existing value automatically but for some reason it doesn't show up. Here's a simplified example: stackblitz (formly's forked) and here's the code: ...
Martin Carre's user avatar
  • 1,165
0 votes
2 answers
21 views

Hide filed in Angular Formly

How to hide fields in formly , cause hide expression hiding the DOM by display:none which alter the position of other element in the current and previous rows . I have a requirement to hold on to the ...
Aravind's user avatar
0 votes
0 answers
39 views

Code Splitting in Angular/Formly to avoid building the whole project for small changes

I'm building a webapp that requires an ever-growing collection of forms. Formly seems to be an excellent tool to do this because it's declarative and reusable. However, placing formly field config ...
aeowlian's user avatar
1 vote
1 answer
82 views

Styling Formly Form Custom Wrapper + Custom Type

So I'd like to have a mat-autocomplete using formly-forms and have a add and delete button at the end of each autocomplete. Most importantly I want this "duo" of autocomplete + button to ...
Martin Carre's user avatar
  • 1,165
1 vote
1 answer
67 views

Formly validation in Storybook throwing NG0100: ExpressionChangedAfterItHasBeenCheckedError

I'm working on a custom Formly wrapper for my form fields and I wanted to display the wrapper in Storybook. I found an excellent example on how to show the wrapper in Storybook (given that all of a ...
richard's user avatar
  • 1,565
0 votes
0 answers
32 views

Type 'any[] | Observable<any[]> | undefined' is not assignable to type 'any[]'

Body: I'm getting the following TypeScript error in my Angular application: error TS2322: Type 'any[] | Observable<any[]> | undefined' is not assignable to type 'any[]'. Type 'undefined' is not ...
Gaurav Raut's user avatar
0 votes
1 answer
214 views

How to configure formly custom components inside standalone components in angular 16

Angular Version: 16.0.4 Formly Version: 6.1.7 I just changed my Angular project to standalone components, which deleted all of the modules. We developed custom formly components, such as input fields ...
Arun M's user avatar
  • 123
0 votes
0 answers
26 views

Formly template field attribute with some html and a model value

Setting up my form fields in json but have problem to show readonly information from model/formState within the json field definitions. This works in angular-formly: "fieldGroup": [ {&...
Ulf's user avatar
  • 1
0 votes
0 answers
181 views

How do I hide a Formly field in using conditions based on the value of a field in a different form-group using expressions?

In formly docs, you can create hide expressions like this: { key: 'iLikeTwix', type: 'checkbox', props: { label: 'I like twix', }, expressions: { hide: '!model.name' }, } Or like this: {...
Akinsanmi Abiola's user avatar
0 votes
1 answer
62 views

Custom Formly Component not showing validation message on blur

I have a custom angular date picker component which uses ngb-datepicker and implements control value accessor. Now I create a formly component from this to use in my json form. This works fine but it'...
Emz's user avatar
  • 485
0 votes
1 answer
62 views

How to add tooltip to angular formly dropdown elements

I want to add tooltip to angular formly dropdown element, is there a way to solve this? Tool tip should contain label - value of the dropdown elements. Is there any tooltip property which we can use ...
Akash Gedam Patil's user avatar
0 votes
0 answers
24 views

ngx-formly password visibility toggle - angular

I want to add a custom input field using ngx-formly where I can toggle the password(eye). I have two fields in the form email/username and password. I tried some kinds of stuff, but not working for me ...
Vishal Rikhi's user avatar
0 votes
1 answer
86 views

ngx-formly how to evaluate whether a multicheckbox answer is chosen

I am using ngx-formly and running into an issue with expressions on multicheckbox. I am attempting to see if the value of "Other" was selected. The box continually displays regardless of ...
DB1856's user avatar
  • 1
0 votes
0 answers
110 views

Angular Material + Formly: Validation inside Nested Custom Types

I'm using Angular Material on a project right now, trying to implement the formly library with custom types. Right now I'm working on Signup, Login, Password Forget and Password Reset Feature. Since ...
Don's user avatar
  • 376
1 vote
1 answer
263 views

Need to update input field label on runtime in ng-formly

Need to update input field label on runtime in ng-formly . { key: 'forename', type:'input', templateOptions: { label: 'Forename'} expressionProperties:{ label:...
user3847870's user avatar
0 votes
1 answer
574 views

Formly form not fully updated after changing field default value

I am trying to update the Formly form rendering after making some changes in the form scheme (the array of FormlyFormConfig objects). It works when I add a new object or if I change a field label, but ...
Marc de Verdelhan's user avatar
0 votes
1 answer
298 views

Async validation message not displaying in ngx-formly

When trying this example from the ngx-formly library, the message that comes from the async validation is not displaying under the field as exprected https://formly.dev/docs/examples/validation/unique-...
HDJEMAI's user avatar
  • 9,496
0 votes
0 answers
117 views

how to use ngx-translate with formly-form to display dynamic error message

I am using formly in my angular application and ngx-translate for language translation. I have multiple form controls with some custom validation. I want to display error messages based on input field ...
lakhan khandelwal's user avatar
1 vote
0 answers
170 views

How to inject data into custom type field for ngx-formly?

my question is so simple: is it possible to inject data inside custom type field in a form created using ngx-formly? I'm working on a Angular project (Angular 14) and I would like to create a select ...
Raul's user avatar
  • 115
0 votes
0 answers
293 views

Storybook error Injector has already been destroyed error when opening story for second time

Describe the bug When any story is opened for first time is displayed correctly but when I open other story and return to one which was already opened I get error. How to solve this issue? ERROR Error:...
Adam Michalski's user avatar
0 votes
0 answers
189 views

Using a formly field, I want to mask input value

{ "key": "accountNum", "type": "input", "className": "col-lg-6 inputClass", "templateOptions": { "...
Sonal Shinde's user avatar
0 votes
0 answers
77 views

Stopping JSON powered NGX-Formly ngFor loop overwriting previous forms in a grid on the same page

In the example below I have a Formly form wrapped in a ngFor loop.The last form model overwrites all the previous ones. How can I stop that behaviour? Parent that host the form loop: <div class=&...
John M.'s user avatar
  • 71
0 votes
0 answers
22 views

hiddenExpression has not worked on hidden filed Validation of formly in Angular 14

I used formly which is dynamic and fields using from the database formly versions::- "@ngx-formly/bootstrap": "^6.1.1", "@ngx-formly/core": "^6.1.1", ...
Sonal Shinde's user avatar
0 votes
1 answer
315 views

Angular Material 15: How can I apply the panelClass property to `<mat-select>` using ngx-formly?

I'd like to style the dropdown panel of Angular Material <mat-select> with a specific width. We're using formly to generate forms in the project. This is how an example configuration of a select ...
asti.v's user avatar
  • 27
0 votes
0 answers
41 views

How to handle i18n when formly json way

when we use formly with JSON powered way, how to use 18n? https://formly.dev/docs/examples/other/json-powered I search a way to specify a key in the json { "key": "lastName", ...
robert trudel's user avatar
0 votes
0 answers
417 views

Angular Formly custom cross field validation check

Hope I can get some advice here. I have a Angular Formly search form to search for client. The way of how the search form work is if ID is filled then 'surname' and 'date of birth' are not needed and ...
bunnap's user avatar
  • 37
0 votes
0 answers
125 views

ngx formly formArray without formcontrol

I have a requirement to create a typeahead component inside a form and storing the results of the search in an array. I am new to angular formly and am trying to achieve the ask using a formArray. I ...
Ravdeep Khanna's user avatar
0 votes
1 answer
251 views

Use @ngx-formly with custom radio component (internal UI components)

I am working with a custom radio components and I'm having a hard time connecting the component to the form using formly v5. This is how I would use the custom radio component <custom-radio name=&...
Erik's user avatar
  • 947
0 votes
0 answers
297 views

How to align Formly form-fields horizontally when using JSON Schema?

I use Formly form JSON schema to render my view. This way the inputs appear below the labels, yet I want the inputs to be displayed beside the labels. I know that form-field-horizontal can be used to ...
SushantRoy's user avatar
0 votes
0 answers
64 views

Ngx formly form Multicheckbox - Angular 9

We are using ngx-formly form in our Angular 9 application. We have some issues with formly multicheckbox implementation. Since the multicheckbox value gets as an Object/ key-value pair. We convert it ...
Vargis.mithun's user avatar
0 votes
0 answers
304 views

How to set value of form control only after it is visible in Angular formly?

I have two radio button which has two values. On clicking of each value, two formcontrols get visible. Now I want to fill the value of those formcontrol. I am getting radiobutton selected based on ...
Shubhangi Garg's user avatar
0 votes
1 answer
277 views

How to unit test form validation on angular using ngx-formly

I'm using ngx-formly (on V5) to generate a form with an input and a checkbox (here is the FormlyFieldConfig): field: FormlyFieldConfig = { className: 'database-header', validators: { validation: [ ...
Sa Hagin's user avatar
  • 502
1 vote
1 answer
762 views

ngx formly repeated field with chips as array of string input angular

I have json object like this { num_info : [["a","b"],["c","d"]] } and using ngx-formly i want to show this on the form. So I have created 2 custom components ...
Sunil Garg's user avatar
  • 14.7k
0 votes
1 answer
699 views

ngx formly custom repeat section not repeating value by default angular material

I am using ngx-formly library to create dynamic forms. So from this link, I am trying repeat custom component. Here is the custom component import { Component } from "@angular/core"; import {...
Sunil Garg's user avatar
  • 14.7k
2 votes
1 answer
2k views

How to hide fields of Formly form, due another model's fields

I have 2 Formly forms in my app. I need to hide a field of one form, due the value of a field in the another one. Formly documentation gives this option (https://formly.dev/examples/field-options/hide-...
Yehuda's user avatar
  • 41
0 votes
1 answer
281 views

How to match nested object keys with values from array with matching keys in lodash

Sorry for the confusing title. I have the results of a form generated from the ngx-formly library. They are an object with key and value pairs that look exactly like this: Form Feedback { "...
tswallen's user avatar
0 votes
1 answer
406 views

Any examples on getting ngx-formly to work correctly with ngrx?

I'm trying to learn ngx-formly and ngrx for a project at work, does anyone know how to correctly get ngx-formly to bind/ update the ngrx store correctly? I can get my data to initialize from the store ...
Tom Yee's user avatar
  • 69
0 votes
0 answers
495 views

has-error not removed for fields having ng-touched class when removing validator using clearValidators()?

Dependencies used "@angular/cli": "^11.2.10", "@ngx-formly/bootstrap": "^5.10.22", "@ngx-formly/core": "^5.10.22" There is an issue with ...
AREH's user avatar
  • 11
0 votes
1 answer
362 views

How to focus first invalid ngx-formly field

I am using ngx-formly for creating dynamic form from field configuration. On submitting form, validation is showed correctly. I want to focus first invalid formly field.
Saad Khan's user avatar
  • 109
0 votes
0 answers
540 views

JSON Schema / Formly dependent sub-schemas

This issue is a bit tricky to describe so bear with me and please ask questions if I am missing anything... Say you have a json object that defines a list of features, each feature has a the same ...
Brandon's user avatar
  • 830
0 votes
1 answer
445 views

How to perform async validation with debounce using ngx-formly?

I tried the following in my form config: fields: FormlyFieldConfig[] = [ { key: 'text', type: 'input', modelOptions: { debounce: { default: 2000, }, ...
Salvatore Iovene's user avatar
1 vote
0 answers
2k views

Change event for a form field in ngx-formly

Scenario - I would like to get the present field value, previous field value and fieldId whenever a particular field loses focus and call an API to perform some validations at the backend html <...
mithun's user avatar
  • 41
2 votes
0 answers
382 views

Why formly-field doesn't render the component?

I made input component and render component in formly. This is simple thing: the app component is render the render-component and render-component is render the input component. But the input ...
Jon Sud's user avatar
  • 10.4k
0 votes
1 answer
814 views

How to change color of Angular Formly description?

I am working with angular formly. Here below is the Image of the Input Field and Its description. What issue I am facing? Initially the description attribute have some default color but I want to ...
Satyam Singh's user avatar
0 votes
1 answer
616 views

How to save checkbox value as string with Formly?

I am currently using Formly to generate checkboxes. When a checkbox is ticked, the value is saved as true but I need it to be as a string like this "true". I also use a JSON to generate the ...
avdeveloper's user avatar
1 vote
0 answers
182 views

How can we add icon with text in form using ngx-fomly/ bootstrap

Did not get any document/info to add an icon with text on the form using ngx-formly/ bootstrap library. Also trying to add icons using addon but in my project, only two icons display on the form (fa ...
The_PratikshaK's user avatar
1 vote
1 answer
1k views

How to unit test ngx-formly?

I am trying to unit test ngx formly but I am getting the following error: [Formly Error] The validator "emailValidator" could not be found. Please make sure that is registered through the ...
Hassan's user avatar
  • 45
0 votes
1 answer
954 views

Angular-Formly - Access Model names for calculated fields with key names containing dot(.)

I have a config json with 3 fields, the 3rd field being a calculated field from data in the previous 2 fields. Now the catch here is I have dot(.) in their key names. e.g. "something.someone"...
SaswatPatro's user avatar