如何将 templateOptions.options 用于 ngx-formly 多复选框字段

【问题标题】：how to use templateOptions.options for ngx-formly multicheckbox field如何将 templateOptions.options 用于 ngx-formly 多复选框字段
【发布时间】：2021-01-20 00:46:54
【问题描述】：

我是我的 Angular 应用程序，我需要从我的应用程序（组件或服务）内部的一个函数中设置多复选框字段的选项。我不知道templateOptions.options 是如何工作的，我应该如何写值？

这是我的 json 代码：

          {
            "key": "clientIds",
            "type": "multicheckbox",
            "className": "flex-1",
            "templateOptions": {
              "label": "Clients",
              "required": true
            },
            "expressionProperties": {
              "templateOptions.options": "??????" // <-- here to bind with a component or shared service method
            }
          }

【问题讨论】：

标签： angular ngx-formly

【解决方案1】：

您有几个选项，但最简单的方法是将options 设置为可观察对象。

// Client Service
import { Injectable } from '@angular/core';
import { Observable, of } from 'rxjs';

@Injectable()
export class ClientService {
    clients = [
        { id: '1', name: 'Michael' },
        { id: '2', name: 'GammaStream' },
    ];

    getClients(): Observable<any[]> {
        return of(this.clients);
    }
}

// component

fields: FormlyFieldConfig[] = [
  {
    key: 'clientIds',
    type: 'multicheckbox',
    className: 'flex-1',
    templateOptions: {
      label: 'Clients',
      required: true,
      options: this.clientService.getClients()
    }
  }
];

constructor(private clientService: ClientService) {}

【讨论】：