我目前正在使用Angular-QueryBuilder并ng-container使用angular -material 更新模板。

我的要求是options动态加载数据。即在用户开始输入后从服务器加载此字段的数据（我将使用mat-auto-complete而不是mat-select）。在为示例创建 stackblitz 时，我面临一些挑战。（到目前为止：https ://stackblitz.com/edit/angular-8-material-starter-template-lpmxwi ）

如果有人实现了类似的东西或给出了一些方向，那就太好了。

更新：

想强调的是，使用材料自动完成不是问题。为查询构建器组件集成自动完成和动态更新值是问题所在。如果我在初始化后以编程方式更新它，查询生成器不会填充值，如下所示。

在通过 angular2-query-builder 创建规则时，我希望允许用户选择静态值或从特定字段中选择该值。怎么办？我可以为 angular2-query-builder 添加新功能吗？

我在我的项目中使用 angular2-query-builder 的角度材料代码，我面临一个问题，我必须根据前一个屏幕的选择动态更改 config.field。当我更改字段时，我可以看到新字段，但是浏览器控制台会抛出以下错误：

调试时，它来自 QueryBuilderComponent.getInputType 我想绕过这个条件，如果找不到字段，则返回 null：

我无法在 node_modules 的 QueryBuilderComponent.js 文件中更改它。如何覆盖或自定义此“getInputType”函数。

我正在为我的 Angular 项目使用 angular2-query-builder，我在控制台中收到以下错误。下面添加了所有代码，并且我还附上了控制台错误截图以供参考。QueryBuilder 版本：“angular2-query-builder”：“^0.6.2” Typescript 版本：“typescript”：“~4.3.2” Angular 版本：12.1.0

我将以下链接作为参考：

https://github.com/zebzhao/Angular-QueryBuilder/blob/master/demo/src/app/app.component.ts

如果我将静态值放入配置，那么它的工作正常，但是当我尝试动态实现时，就会发生这个问题，需要单击 addRule 按钮时的屏幕截图“Success_QB”图像中的结果。但这现在没有发生。在此处输入图像描述 在此处 输入图像描述

控制台错误详细信息：

错误类型错误：无法在 wrapListenerIn_markDirtyAndPreventDefault 的 executeListenerWithErrorHandling (core.js:15285) 的 FileAssignmentComponent_ng_container_11_Template_button_click_1_listener (file-assignment.component.html:18) 处读取 QueryBuilderComponent.addRule (query-builder.component.js:894) 处未定义的属性“值” (core.js:15323) 在 HTMLButtonElement。(platform-b​​rowser.js:560) 在 ZoneDelegate.invokeTask (zone.js:406) 在 Object.onInvokeTask (core.js:28664) 在 ZoneDelegate.invokeTask (zone.js:405) 在 Zone.runTask (zone.js :178) 在 ZoneTask.invokeTask [作为调用] (zone.js:487)

我的代码：

从 'angular2-query-builder' 导入 { QueryBuilderComponent, QueryBuilderConfig, Rule }; 导出类 FileAssignmentComponent 实现 OnInit { @ViewChild(QueryBuilderComponent, { static: false }) queryBuilder: QueryBuilderComponent;

公共 currentConfig：QueryBuilderConfig；

公共配置：QueryBuilderConfig = { 字段：{} };

公共查询= {条件：'和'，规则：[]，}；

构造函数() { this.queryCtrl = this.formBuilder.control(this.query);

// 使用 web api 从 DB 动态加载 QB 字段数据 this.fileassignmentService.getQueryFilterReviewElement(this.commonSvc.reviewer_name) .subscribe( (res) => { this.QryFiltReviewEle = res; this.QryFiltReviewEle.map((v) => { this.config.fields[v.key] = { name: v.value, type: 'category', operator: v.datatype === 1 ? strOperators : numDateOperators, options: this.dataEleOptions } }); }, (error) => { this.Snakebar.openSnackBarError('意外错误！请联系管理员。'); } ) }

ngOnInit(): 无效 {

}

让实体的实体" [value]="entity.value"> {{entity.name}} <ng-container *queryField="let rule; 让字段=字段；让 onChange=onChange; 让 getFields = getFields"> <mat-select [(ngModel)]="rule.field" (ngModelChange)="onChange($event, rule)" (selectionChange)="onSelectQBElement($event)"> <mat-option *ngFor="let field of getFields(rule.entity)" [value]="field.value"> {{ field.name }} <ng-container *queryOperator="let rule; 让运营商=运营商；让 onChange=onChange"> <mat-form-field [style.width.px]="90"> <mat-select [(ngModel)]="rule.operator" (ngModelChange)="onChange(rule)"> <mat-option *ngFor="let value of operator" [value]="value">

如果有人对此提供帮助，将不胜感激。