我有以下HTML,但是我得到了异常.怎么修呢?

分析器错误:获取了预期表达式所在的插值({})

<div class="form-group">
  <label class="form-control-label" for="field_exportExpression">exportExpression</label>
  <input class="form-control" type="text" id="field_item_exportExpression_{{i}}" name="item_exportExpression_{{i}}" [(ngModel)]="datatype.items[i].exportExpression" required>
  <div [hidden]="!(editForm.controls.field_item_exportExpression_{{i}}?.dirty && editForm.controls.field_item_exportExpression_{{i}}?.invalid)">
   <small class="form-text text-danger" [hidden]="!editForm.controls.field_item_exportExpression_{{i}}?.errors?.required" dpTranslate="dataconfiguration.validation.required"> This field is
                            required. </small>
 </div>
</div>

以下内容不起作用.说找到了[个不需要的 token .

[hidden]="!editForm.controls.['item_exportExpression_' + i]?.errors?.required 

以下不是抱怨[,而是抱怨Cannot read property '0' of undefined

 [hidden]="!editForm.controls.item_exportExpression_[ i]?.errors?.required 

推荐答案

模板

<div [hidden]="!checkIfInvalid(i, 'item_exportExpression_')">
                            <small class="form-text text-danger" [hidden]="isRequiredError(i, 'item_exportExpression_')" dpTranslate="dataconfiguration.validation.required"> This field is
                                required. </small>
    </div>

组成部分

checkIfInvalid( index: number, field: string ): boolean {
        const control = this.getControl( index, field );
        if ( control && control.dirty && !control.valid ) {
            return true;
        }
        return false;
    }

    isRequiredError( index: number, field?: string ): boolean {
        const control = this.getControl( index, field );
        if ( control && control.getError( "required" ) ) {
            return true;
        }
        return false;
    }

Angular相关问答推荐

Angular - MSAL用户缺少角色

在Angular 应用中混合使用较少和较粗俗的文件

我正在try 将一个带有模块联盟的Angular 8项目expose 到另一个Angular 项目,Angular 是15,这可能吗?如果是这样,有什么建议吗?

如何将Angular 服务包含在延迟加载的独立组件路由中?

在Cypress中,对xlsx文件的读取并不总是正确的

Angular 应用程序未在Azure应用程序服务中运行

VSCode / Angular 应用程序未完全启动

角 12 固态继电器 |页眉页脚在加载程序到来之前显示

RxJS - .withLatestFrom 的多个来源

如何使用ngrx和effects 订阅成功回调

Angular 7 测试:NullInjectorError:No provider for ActivatedRoute

如何以Angular 获取嵌套表单组的控件

Angular 2 Material - 如何居中进度微调器

如何为 Angular 2 中的渲染元素绑定事件监听器?

angular 5 material - 表单字段停留在 180px

Angular Material2 主题 - 如何设置应用程序背景?

安装特定版本的 ng cli

在Angular2 Dart中设置路由和RouterLink的正确方法是什么

Lint 错误:实现生命周期挂钩接口

如何从指令访问主机组件?