angular-formly中 expressionProperties 属性的使用方式:

参考网址:https://formly.dev/guide/getting-started

 

expressionProperties 属性的使用方式:
import {Component} from '@angular/core';
import {FormGroup} from '@angular/forms';
import {FormlyFieldConfig} from '@ngx-formly/core';

@Component({
  selector: 'app',
  template: `
    <form [formGroup]="form" (ngSubmit)="onSubmit(model)">
      <formly-form [form]="form" [fields]="fields" [model]="model"></formly-form>
      <button type="submit" class="btn btn-default">Submit</button>
    </form>
  `,
})
export class AppComponent {
    // 是否保存为草稿 状态
    isRequired = 'true'
    
  form = new FormGroup({});
  model = { email: 'email@gmail.com' };
  fields: FormlyFieldConfig[] = [
    {
      key: 'email',
      type: 'input',
      templateOptions: {
        label: 'Email address',
        placeholder: 'Enter email',
        required: true,
      },
      expressionProperties:{
          'templateOptions.required': () => this.isRequired  // 不是为草稿状态下 是必填字段
      }
      
    },
     {
      key: 'email',
      type: 'input',
      templateOptions: {
        label: 'Email address',
        placeholder: 'Enter email',
        required: true,
      },
      expressionProperties:{
          'templateOptions.required': () => this.isRequired  // 不是为草稿状态下 是必填字段
      }
      
    }
  ];

  onSubmit() {
    console.log(this.model);
  }
}

  

posted @ 2020-09-16 14:58  杨煊煊  阅读(308)  评论(0编辑  收藏  举报