我正在尝试在 Angular 11 中使用 ng-select 和 ngx-formly。我一直在关注官方文档提供的教程。 https://egghead.io/lessons/angular-use-3rd-party-form-controls-with-angular-formly
如果我能得到帮助来确定我的代码是否出错或者我是否错过了任何步骤,那就太好了。
以下是我的实现:
import { Component } from '@angular/core';
import { FormControl } from '@angular/forms';
import { FieldType } from '@ngx-formly/core';
@Component({
selector: 'formly-ng-select',
template: `<div class="mat-input-infix mat-form-field-infix">
<ng-select
[items]= "(to.options|formlySelectOptions:field|async)!"
[placeholder]="to.label || 'placeholder'"
[bindValue]="to.bindValue || 'value'"
[formControl]="formControl">
</ng-select>
</div>`
})
export class NgSelectFormlyComponent extends FieldType {
formControl!: FormControl;}
我在我的主要组件中使用上述自定义模板,如下所示:
fields: FormlyFieldConfig[] = [
{
key: 'nationId',
type: 'my-autocomplete',
// type: 'select',
templateOptions: {
label: 'Nation',
options: this.dataService.getNations()
}
}];
我还在我的 app.module 中添加了它,如下所示:
FormlyModule.forRoot({
types: [{
name: 'my-autocomplete',
component: NgSelectFormlyComponent,
// wrappers: ['form-field'],
}]
})]