Formly - 如何将字段链接到自定义模板的模型

问题描述

我正在使用 Angular 8 和 Formly 来创建带有搜索的选择输入类型。作为解决方案，我发现 ng-select 很适合我。

问题是如何将 [model] 指令链接到使用我的自定义模板的 Formly 字段？

注意：我不想使用纯文本，比如 model.my.special.key - 我需要给它一些通用的东西。通过这种方式，我可以将它与我想在搜索中使用此选择器的其他字段一起使用。

更详细地说明我到目前为止所做的：

我创建了一个扩展 @Component 的新 FieldType 并有一个模板，该模板使用选择器来显示它作为输入接收的选项

@Component({
  selector: "SelectorWithSearchModule",template: `
    <ng-select
      [items]="to.options"
      bindLabel="label"
      bindValue="code"
      labelForId="code"
      placeholder="{{ to.label }}"
      [multiple]="to.multiple"
      clearallText="Clear"
      (change)="onChange($event)"
      [(ngModel)]="what-to-put-in-here?"
    >
    </ng-select>
  `
})
export class SirutaModule extends FieldType implements OnInit {}

我在 app.module.ts 中声明了这个新组件并用它扩展了 Formly 类型：例如：

import { SelectorWithSearchModule } from "./types/selector/special-selector.component"; // declaration
...
FormlyModule.forRoot({ // from here begins the Formly deFinition
types: [
{
  name: "special-selector",component: SelectorWithSearchModule 
}
]

我在定义新 Formly 字段时使用了 special-selector 名称

{
  className: "col-8",type: "special-selector",key: "my.hierarchy.key",templateOptions: {
    label: "some label here",options: ["option_one","option_two"]
  }
}

我最终希望键 my.hierarchy.key 包含在我的自定义模板中选择的值 user，但具体如何操作不是很清楚。

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

angular-formly angular-ngselect angular8