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.
447
questions
0
votes
0
answers
9
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 ...
0
votes
0
answers
20
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 ...
0
votes
1
answer
27
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
0
answers
80
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 ...
0
votes
1
answer
39
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
20
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
25
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[] {...
0
votes
0
answers
28
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 ...
0
votes
0
answers
99
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 ...
1
vote
1
answer
98
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
88
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
27
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
0
answers
55
views
Hide options of a question on the basis of answer of previous question using ng-formly
formSchema:[
{
"key" : "6332c96442b5f914f06e74ce",
"type" : "radio",
"hideExpression" : "",
"templateOptions" : {
"label&...
0
votes
0
answers
17
views
I am getting disabled Angular Spec file code lines
There is Angular spec file, in which I am trying to cover the lines, but these code line are disabled format. Any idea, what could be the reason for this.
As a information.
I am using formly component,...
0
votes
0
answers
122
views
How to show seperator between options in the formly form select?
A formly form is used to build a form in Angular which store company details. We just added a country drop-down to the form. I have to show country INDIA and nearest countries( as Favorite countries) ...
0
votes
2
answers
32
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 } ...
0
votes
0
answers
44
views
Why am I getting this error on my custom inline validation function in angular formly: r.validation is not a function?
I am working with Angular formly and according to this site: https://formly.dev/guide/validation, I should be able to do this:
{
"id": "blah.blah.blah",
"key": "...
-1
votes
1
answer
155
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: ...
0
votes
0
answers
155
views
Ng-Mask with formly for SSN in Angular
Basically I'm trying to populate hyphens in ssn and also trying to mask first 5 numbers with *.
Output expected
SSN Formly
I have built a custom type called mask and also given maskstring. You can ...
0
votes
0
answers
44
views
Autosaving working for entire form, only need to autosave after selecting a component in form
I have an Angular form that is saving the entire form instead of one component (Copy Schedule from Site) in the form. Is there a way to do that? My form setup is using formly in typescript and the ...
2
votes
1
answer
1k
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-...
0
votes
0
answers
114
views
how can I enable only certain dates with formly date-mask
We are working on an Angular application that uses formly forms. I have a requirement to create a date-mask or datemask-input field that, under certain conditions, the user can select only the first ...
2
votes
0
answers
442
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
116
views
We are using Material UI for the whole Angular project, can we use Formly with Bootstrap UI ? Does it create any problem?
We are using Material UI for the whole Angular project. Now we have to use Formly (https://formly.dev/) for forms. Can I use bootstrap theme in my project for styling the form fields ?
0
votes
0
answers
521
views
Angular Formly - Clearing Array Property of Model Based on Value of Another Field
I am using Formly for Angular in my app. The model of the form looks like this:
// ins-submission.ts
export class InsSubmission {
id: number | undefined;
empID: string = "";
...
0
votes
0
answers
359
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
406
views
ngx-formly queries related to expression properties
In our angular application we are using the ngx-formly version 5.10.23
I have few question related to that
Are formly fields rendered synchronously? If it is happening asynchronously can we make this ...
0
votes
0
answers
45
views
How to add sorting and searching functionality in dynamically added table using ngx-formly in angular
I have just started using ngx-formly and added some dynamic controls to a page. I was wondering if there is a way to add sorting and searching functionality on a table dynamically created using ...
0
votes
0
answers
439
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
362
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
456
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
96
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
219
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
316
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
221
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
306
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
206
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 ...
0
votes
0
answers
550
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
246
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
574
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
86
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
897
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 ...
1
vote
0
answers
38
views
How to create a custom typeahead using angular-formly which should be generic, any suggestions?
I am new to formly, I tried creating typeahead but got stuck. Please help me out in creating typeahead.
1
vote
0
answers
177
views
How to translate the Month and Day in Date-picker pop-out calendar for Angular Formly?
I have integrated Date picker into my angular version 8 and it is working as expected. My form uses internationalization to which ngx-formly supports with the help of ngx-translate. I would like to ...
0
votes
1
answer
731
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"...
0
votes
1
answer
176
views
angular, Java : HTTP request not going to server, while URL is valid
I am working in an application : Java Backend and Angular frontend. I am using angular Fromly, data is coming to service, but from the service it is not going to server.
lets share the code snipts:
...
0
votes
0
answers
106
views
Formly Form loading hanging site performance
I have implemented complex custom wrapper.
If the FORM contain 10+ custom wrapper it is hanging HTML UI page for some seconds.
For example when ng-if is true, 5+ seconds HTML hanged.
<form [...
1
vote
0
answers
132
views
Why hintEnd not render in formly with material?
I try to use the hintEnd from material with formly option:
<mat-hint *ngIf="to.hintEnd as hintEnd" align="end">
<ng-container [ngTemplateOutlet]="stringOrTemplate&...
-2
votes
1
answer
725
views
How can we create JSON schema to build a angular formly based forms on basis of plain JSON?
We have a requirement in which we are planning to build a form according to the JSON received and convert it to JSON schema which is supported by formlyJsonschema, is there any way of achieving this?
...
0
votes
0
answers
178
views
How to include the leaflet map in angular formly with custom component
I have to create the leaflet map where I have used the angular formly .
and I have created the custom component for leaflet map as
leaflet.component.ts
import { Component, OnInit } from '@angular/core'...