Questions tagged [angular-formly]
angular-formly is an AngularJS module which has a directive to help customize and render JavaScript/JSON configured forms. The formly-form directive and the formlyConfig service are very powerful and bring unmatched maintainability to your application's forms.
angular-formly
455
questions
0
votes
0
answers
5
views
Displaying input types within a custom input type (ngx-formly)
I'm trying to create a custom input type (multiField) which displays multiple arbitrary inputs within itself. It seems like the formly-field directive should make this reasonably doable. I should just ...
0
votes
0
answers
14
views
How does hideexpression work with custom validation?
I have fieldGroup with hideexpression and a field with custom validation in this field group. First time the expression hide the fieldgroup and it will be visible after I push a button. My problem is ...
0
votes
1
answer
39
views
Add input file field to FormlyFieldConfig
I'm building a form in my project and I have to add an image selection field, that is, an input field of type file. I searched a few places on the internet and couldn't find my solution. Has anyone ...
0
votes
0
answers
32
views
Formly Repeated Section with length input
{
key: 'skewNumber',
type: '#custom-input',
className: 'col-6',
props: {
type: 'number',
label: 'No. of skew :',
placeholder:...
1
vote
0
answers
28
views
Formly Reset the Errors on Focus Out for Prime Input Mask
Formly should retain error instead of nullifying the errors for inputmask.
https://stackblitz.com/edit/angular-ljcdzn-3r3fwu?file=src%2Fapp%2Fapp.component.ts,src%2Fapp%2Finput-mask.component.ts,src%...
0
votes
0
answers
27
views
FormGroup is returning the last active form object
I'm am working on dynamic forms, with formly on angular Typescript, the formGroup displays correctly all the time, but initially the current form is console log correctly, but when I click on another ...
0
votes
2
answers
394
views
Ngx-Formly how to pass custom properties to a custom type?
I'm trying to create a formly custom type. I want to be able to pass a custom property with the call to a service in the field definition. For example
{
key: 'city',
type: 'customType',
props: {
...
0
votes
2
answers
137
views
Angulrar formly fieldGroup is not working for field with key as integer
Angular formly fieldGroup should the object but it is returning the array as value.
as per formly field config, inventories property in model object should be in object but it is giving array.
package....
0
votes
0
answers
71
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 "...
-1
votes
1
answer
295
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, ...
0
votes
0
answers
200
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:
...
0
votes
2
answers
75
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 ...
1
vote
1
answer
429
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 ...
0
votes
1
answer
33
views
How to achieve that in the property of a model that expects an array the added value is kept within the array?
I have the following models. as you can see email expects a string array
export interface Member {
id: string;
name: string;
lastName: string;
emails: string[];
}
export type MemberPreview = ...
0
votes
1
answer
415
views
get the value in string date format instead of a value of type date when selecting a value of a formally custom type
I have created a formly custom form type. It's a primeng calendar
Custom type component
@Component({
selector: 'ts-multi-shl-siep-admin-global-formly-calendar-type',
template: `<div>
<...
0
votes
0
answers
42
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 ...
0
votes
1
answer
183
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'...
0
votes
1
answer
133
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 ...
0
votes
0
answers
193
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 ...
1
vote
1
answer
490
views
Get storybook to use local assets in a node_module for a story of a component with a tinymce editor?
I am writing an Angular 15 Application making use of the formly-package to generate forms for me. Formly provides most fields to render inside of its forms out of the box, but not a field with a rich ...
0
votes
1
answer
631
views
How to write a storybook story for a custom formly field?
I am writing an Angular 15 Application making use of the formly package to generate forms for me. Formly provides most fields to render inside of its forms out of the box, but not a file-field. So I ...
0
votes
1
answer
1k
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 ...
0
votes
0
answers
155
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 ...
0
votes
0
answers
304
views
Using a formly field, I want to mask input value
{
"key": "accountNum",
"type": "input",
"className": "col-lg-6 inputClass",
"templateOptions": {
"...
0
votes
1
answer
330
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=&...
0
votes
1
answer
226
views
What is the way to assign a default value to the datepicker range component of angular material used in formly?
I am in the following way using the datepicker range component of angular material in formly
component class
form = new FormGroup({});
model: DashboardFilterModel = {
criteria: '',
category: ...
0
votes
1
answer
631
views
What is the way to update the option values of a select control from the value emitted by another control?
In a form similar to this
formGroup = new FormGroup({});
modela!: any;
fieldsa: FormlyFieldConfig[] = [
{
key: 'field1',
type: 'select',
props: {
label: 'Field1',
...
0
votes
1
answer
271
views
How to disable all formally controls?
I have a long form that looks similar to the following:
...
export function directoryForm(
countries: CountryModel[],
dealers: DealerModel[],
translate: TranslateService
): FormlyFieldConfig[] {...
1
vote
1
answer
515
views
How do I properly integrate angular material datepicker range in formly?
I am trying to integrate angular material datepicker range in formly
To this end I am doing the following:
I have created the following formally type
Component:
@Component({
selector: 'app-formly-...
0
votes
1
answer
380
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: [
...
1
vote
0
answers
77
views
Remove empty option from angularjs angular-formly select
I recently upgraded my angularJs project from version 1.5.8 to 1.8.3. Since then I am seeing an empty option in the select drop down. How can I remove that option. I am using angular-formly for my ...
0
votes
2
answers
402
views
what is the correct way to assign default values to a select multiple?
Update
I was able to solve it by modifying the model so that only the role ids are listed in the roles property
constructor(private readonly activatedRoute: ActivatedRoute) {
const { user, roles } ...
1
vote
1
answer
519
views
Access to Angular Formly Material Datepicker
I want to access the formly datepicker to make it close after selecting the year.
But Im not able to access the datepicer object. Can please anybody help? Thank you!
fieldsOfMyForm: ...
2
votes
1
answer
3k
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-...
3
votes
0
answers
633
views
how to add icon button and click event in formly form for material UI?
I have a select field which contains file name, i want a eye button above select field on right.
I am using formly form and UI is angular material. how can i add eye button on right side above select ...
0
votes
0
answers
560
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 ...
0
votes
0
answers
669
views
Disabled checkbox(es) in Angular formyl
How can I disable the checkbox without displaying this warning message?
"It looks like you're using the disabled attribute with a reactive form directive.
If you set disabled to true. when you ...
-1
votes
1
answer
728
views
Angular Formly - Focus on the first editable element
In our project, we used Angular Formly to generate complex forms (with complex grouping). I checked the component documentation, but I couldn't find any sample or solution for finding the first ...
1
vote
0
answers
941
views
how to get which field clicked in formly-form?
I have a formly-form with icon addon wrapper. i want to get fields value when user clicked icon of that field.
Look in Addon wrapper there is icon and onClick call showFile funtion and there want to ...
1
vote
0
answers
169
views
How to set max value dependent on other fields in Angular Formly?
I have two fields, e.g. x and y. I want the third field to have max value set to sum of the others. How to achieve this? max option doesn't work with this expression
{
"className"...
0
votes
1
answer
417
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.
0
votes
0
answers
585
views
Angular Formly options value causes Placeholder bug
My options dropdown has a boolean value in this Formly field. Whenever the value is false, this causes the placeholder and the options label to be overlayed over each other.
I don't have this issues ...
0
votes
1
answer
479
views
JSON value into FormlyFirldConfig of Formly Form
I am trying to add a json file formatted to fit the formlyconfig file but unable to do so
Here is my HTML
<div class="row">
<div class="col-md-4 mb-4">
<...
0
votes
0
answers
697
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 ...
1
vote
0
answers
283
views
Ion-select multiple options but with one exclusive options
So I would like to create a ion-select with multiple options but with one option that is exclusive.
Example :
In this image, if I select Nowhere the other options deselect themselves and if I select ...
1
vote
0
answers
919
views
Angular Formly File Upload - File Path, Not Contents Being Displayed
I am attempting to build a form that allows for file uploads using Angular (v12) and Formly (v5). I have referenced Formly File Input example and implemented my solution accordingly.
In app.module the ...
2
votes
0
answers
456
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 ...
0
votes
1
answer
934
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 ...
0
votes
1
answer
129
views
Force other components to run (change) before my button's (mousedown)
I have a button on formly with mousedown that has a method called "analyzeClick()"
<button *ngIf="show" (mousedown)="analyzeClick()" id={{htmlID}}>
{{label}}
<...
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 ...