Can't bind ngModel.errors in condition of *ngSwitchCase. But if i do this on *ngIf, it's work fine for me.
I wan't make a structure of displaying different's error's in condition of *ngSwitchCase.
StackBlitz sandbox

我try 了*ngSwitchCase="name.errors?.required"的不同版本,但唯一对我有效的解决方案是*ngIf="name2.errors?.required". 但我想做4个或更多的错误条件,我认为在*ngSwitchCase 个条件下做会更正确和可读性更好,但在开始学习Angular 后,我不能理解为什么这个指令不起作用. 预先感谢您的回答

推荐答案

您可以使用条件值为truengSwitch来创建多个if else语句,如下所示!

如果情况属实,就会显示出来!

由于minLength有一个类似{ "minlength": { "requiredLength": 5, "actualLength": 4 } }的对象,当错误出现时,我们可以使用!!name.errors?.minlength将值转换为布尔值并显示错误!

<div [ngSwitch]="true">
  <div class="error" *ngSwitchCase="name.errors?.required">The name is required</div>
  <div class="error" *ngSwitchCase="!!name.errors?.minlength">Minimum length of a name is 5!</div>
</div>

stackblitz demo

Typescript相关问答推荐

处理API响应中的日期对象

属性的类型,该属性是类的键,其值是所需类型

为什么typescript要把这个空合并转换成三元?

在映射类型中用作索引时,TypeScrip泛型类型参数无法正常工作

使用动态主体初始化变量

角效用函数的类型推断

在实现自定义主题后,Angular 不会更新视图

Cypress页面对象模型模式.扩展Elements属性

如何在Typescript 中组合unions ?

如何合并两个泛型对象并获得完整的类型安全结果?

界面中数组中的混合类型导致打字错误

Angular 16将独立组件作为对话框加载,而不进行布线或预加载

react 路由不响应参数

如何创建内部和外部组件都作为props 传入的包装器组件?

TaskListProps[]类型不可分配给TaskListProps类型

TypeScript:如何使用泛型和子类型创建泛型默认函数?

使用本机 Promise 覆盖 WinJS Promise 作为 Chrome 扩展内容脚本?

为什么 typescript 在对象合并期间无法判断无效键?

如何让 Promise 将它调用的重载函数的类型转发给它自己的调用者?

是否有解释为什么默认情况下在泛型类型上访问的属性不是索引访问