Angular material Angular CLI 8-json模式的格式自定义选择（草案4）

我在让json模式（草案4）完全使用Angular Formly表单自定义模板时遇到了一些困难。我已经为不同的数据类型制作了几个模板，我一直在使用Angular CLI中的select标签制作下拉菜单模板。我已经找到了很多关于如何为较新的json模式创建select组件的示例，但不适用于使用enum（请参阅：我的json部分）进行选择的较旧模式

这是我的json部分：

"hardware": {
    "type": "object",
    "title": "hw.net",
    "properties": {
        "network-0": {
            "type": "string",
            "title": "hw.net.types",
            "enum": [
                "dhcp",
                "static"
            ],
            "default": "dhcp"
        }
    }
}

import { Component } from '@angular/core';
import { FieldType } from '@ngx-formly/core'; 

@Component({
  selector: 'formly-enum-type',
  template: `
    <mat-label *ngIf="to.label">{{ to.label | translate }}</mat-label>
    <mat-select [formControl]="formControl" [formlyAttributes]="field" (selectionChange)="to.change && to.change(field, formControl)">
      <ng-container *ngFor="let item of to.options">
        <mat-option [value]="item">{{ item }}</mat-option>
      </ng-container>
    </mat-select>
  `,
})

export class EnumTypeComponent extends FieldType { }

以下是我的角度分析方法（更新日期：26.03.2020，14:37）：

"hardware": {
    "type": "object",
    "title": "hw.net",
    "properties": {
        "network-0": {
            "type": "string",
            "title": "hw.net.types",
            "enum": [
                "dhcp",
                "static"
            ],
            "default": "dhcp"
        }
    }
}

import { Component } from '@angular/core';
import { FieldType } from '@ngx-formly/core'; 

@Component({
  selector: 'formly-enum-type',
  template: `
    <mat-label *ngIf="to.label">{{ to.label | translate }}</mat-label>
    <mat-select [formControl]="formControl" [formlyAttributes]="field" (selectionChange)="to.change && to.change(field, formControl)">
      <ng-container *ngFor="let item of to.options">
        <mat-option [value]="item">{{ item }}</mat-option>
      </ng-container>
    </mat-select>
  `,
})

export class EnumTypeComponent extends FieldType { }

从'@angular/core'导入{Component}；
从'@ngx formly/core'导入{FieldType}；
@组成部分({
选择器：“formly枚举类型”，
模板：`
{{to.label | translate}}
{{item}}
`,
})
导出类EnumTypeComponent扩展FieldType{}

意外结果：

我的剧本显然有点不完整甚至错误。我试图弄清楚，如何正确地将“enum”部分加载到我的“option”标记中。当前结果是一个带有对象而不是文本的下拉菜单。请记住，此json模式是使用创建的，必须保持这种方式

感谢您的帮助

多谢各位

更新（已解决）：

---

我们能够使用json管道特性来解决这个问题，以查看对象中的内容。之后，我能够修复我的脚本，以便正确显示对象项

如果有人需要做类似的事情，这里是我的固定组件

@Component({
  selector: 'formly-enum-type',
  template: `
    <mat-label *ngIf="to.label">{{ to.label | translate }}</mat-label>
    <mat-select [formControl]="formControl" [formlyAttributes]="field" (selectionChange)="to.change && to.change(field, formControl)">
      <ng-container *ngFor="let item of to.options">
        <mat-option [value]="item.value">{{ item.label }}</mat-option>
      </ng-container>
    </mat-select>
  `,
})

export class EnumTypeComponent extends FieldType { }

@组件({
选择器：“formly枚举类型”，
模板：`
{{to.label | translate}}
{{item.label}
`,
})
导出类EnumTypeComponent扩展FieldType{}

能够使用json管道功能

{{{item | json}}

来解决这个问题，以查看我的对象中有什么。之后，我能够修复我的脚本，以便正确显示对象项。我已经在上面的更新中包含了我的固定组件脚本。

能够使用json管道特性

{{item | json}}

来解决这个问题，以查看我的对象中有什么。之后，我能够修复我的脚本，以便正确显示对象项。我已经在上面的更新中包含了我的固定组件脚本