首页 > 解决方案 > Angular Typescript 在 Switch 语句的视图中显示变量

问题描述

我正在尝试显示 JSON 响应中可能存在的一些值。如果它们不存在,则应将它们设置为 0。

我的 switch 语句看起来像我的组件打字稿中的样子:

this.failures = obj.failures;
this.subsystemFailure = new SubsystemFailure();

        for(let i=0;i<this.failures.length; i++){
              switch(this.failures[i].appName) {
                case "a": 
                  this.subsystemFailure.a = this.failures.appFailures;
                  break;
                case  "b": 
                  this.subsystemFailure.b = this.failures.appFailures;
                  break;
                case  "c": 
                  this.subsystemFailure.c = this.failures.appFailures;
                  break;
                case  "d": 
                  this.subsystemFailure.d = this.failures.appFailures;
                  break;
                case "e": 
                this.subsystemFailure.e = this.failures.appFailures;
                  break;
                case "f": 
                  this.subsystemFailure.f = this.failures.appFailures;
                  break;              
                case "g": 
                  this.subsystemFailure.g = this.failures.appFailures;
                  break;
                case "h": 
                  this.subsystemFailure.h = this.failures.appFailures;
                  break;
                } 

            }

我的类 ts 文件如下所示:

export class SubsystemFailure {
  a: number;
  b: number;
  c: number;
  d: number;
  e: number;
  f: number;
  g: number;
  h: number;

  constructor(){
    this.a = 0;
    this.b = 0;
    this.c = 0;
    this.d = 0;
    this.e = 0;
    this.f = 0;
    this.g = 0;
    this.h = 0;
  }
}

我正在尝试在视图中显示数据,如果没有值,如果将显示为零:

<li>
  <div class="title">A</div>
    <div class="value">
      <strong>{{subsystemFailure.a}}</strong>
    </div>
  <div>
</li>

目前,subsystemFailure.a(它是第一个)变量以未定义的形式返回。谁能指出我正确的方向?

标签: javascriptangulartypescript

解决方案


所以我最终将代码重构为:

  this.subsystemFailure = new SubsystemFailure();

  if(this.failureFlag) {
    for (let app of json.failures) {
      this.subsystemFailure[app.appName] = app.appNoOfFailures || 0;
    }
   }

这不是一个 switch 语句,而是迭代响应并分配与 关联appName的值,如果响应中没有 an appName,则分配值 0 。


推荐阅读