ng-mat-forms
  • Introduction
  • Installing
  • Getting Started
  • Attributes
    • Options
      • column
      • errorMsgOnSubmit
      • floatLabel
      • color
      • appearance
    • Fields
      • type
      • label
      • formControlName
      • directive
      • placeholder
      • regex
      • defaultValue
      • validators
      • list
      • disable
      • labelShow
      • minDate
      • maxDate
      • changeEvents
      • blurEvents
      • maxLength
      • minLength
      • getListFromApi
      • api
      • loadDepenentSelectOnChange
      • errorMessage
  • Callbacks
    • formFieldsChange
    • formChange
    • formSubmit
  • Apis
    • setControlValue
    • setFormValue
    • setControlDisable
    • setControlEnable
    • setValidator
    • removeValidator
Powered by GitBook
On this page
  • Description
  • Hint:
  • Example

Was this helpful?

  1. Attributes
  2. Fields

loadDepenentSelectOnChange

Description

This property is helps to load the dependent select field on the change of the field.

Hint:

  • Type: Object

  • Property of NgMatFormField

Example

Fields: NgMatFormFields[] = [{
    type: 'select',
    label: 'Animal',
    placeholder: 'Select Animal',
    formControlName: 'animal',
    list: [],
    getListFromApi: true,
    api: {
        header: new HttpHeaders().set('Access-Control-Allow-Origin', '*'),
        url: 'https://my-json-server.typicode.com/msk-satheesh-5599/Portfolio/db',
        method: 'get',
        params: {}
    },
    validators: [Validators.required],
    errorMessage: {
        required: 'required!'
    },
    loadDepenentSelectOnChange: {
        //formControl name of the depenent select field
        formControlName: 'dependent',
        //api service
        api: {
            header: new HttpHeaders().set('Access-Control-Allow-Origin', '*'),
            url: `https://my-json-server.typicode.com/msk-satheesh-5599/Portfolio/data`,
            method: 'get',
            params: { value: 'msk' }
        },
    }
}, {
    type: 'select',
    label: 'Food of animal',
    placeholder: 'Select Food',
    formControlName: 'dependent',
    list: [],
    validators: [Validators.required]
}];

PreviousapiNexterrorMessage

Last updated 5 years ago

Was this helpful?