javascript - 类型错误 : Cannot read property 'length' of null

标签 javascript html angular

我想运行这段简单的代码,基本上它根据状态(字符串)更改标签和图标

  <ng-container *ngIf="container.length > 0">
                <span *ngIf="!container.status.includes('Paused') && container.status.includes('Up')"
                      class="label label-success label-lg-status"><span class="fa fa-check"></span> Completed - {{ container.status }}</span>
                <span *ngIf="container.status.includes('Paused')" class="label label-warning label-lg-status"><span
                  class="fa fa-pause"></span> Completed - {{ container.status }}</span>
                <span *ngIf="container.status.includes('Exited')" class="label label-danger label-lg-status"><span
                  class="fa fa-stop"></span> Completed - {{ container.status }}</span>
   </ng-container>

但我收到一条错误消息,说不能使用 null 的包含,所以我输入了 *ngIf="container.length > 0",现在我收到了 ReportComponent.html:22 ERROR TypeError:无法读取 null 的属性“长度”

如何让 html 等待 get 请求的执行?

export class ReportComponent implements OnInit {

  private containerName:string;
  private processes = [];
  private container = [];
  private settings = [];
  private environment = [];
  private id:Number;

  constructor(private _route:ActivatedRoute, private dockerService:DockerService, private environmentService:EnvironmentService, private settingsService:SettingsService) { }

  ngOnInit() {
      // Get Environment id
      this._route.params.subscribe(params => {
        this.id = params['id'];
        // Get Environment
        this.environmentService.getEnvironment(this.id).subscribe( environment => {
          this.environment = environment;
          console.log(environment);
          //this.containerName = this.environment.name;
        });
        // Get Docker processes
        this.dockerService.getProcesses(this.containerName).subscribe(processes => {
          this.processes = processes;
        });
        // Get Docker Container Object
        this.dockerService.getContainer(this.containerName).subscribe( container => {
          this.container = container;
        });
        // Get Settings
        this.settingsService.getSettings().subscribe( settings => {
          this.settings = settings;
        });
    });
  }
}

最佳答案

是的可以这样用,这样会更有 Angular

  <ng-container *ngIf="container?.length > 0">

它也会起作用。

关于javascript - 类型错误 : Cannot read property 'length' of null,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50446041/

相关文章:

javascript - 从默认导入开 Jest 模拟异步函数

javascript - 如何从 html Canvas CanvasGradient 和 CanvasPattern 对象中提取属性

javascript - HTML 中的 XML,然后将 XML 保存为文件?

html5 - Canvas 元素 - 多层

javascript - 无论如何,有没有办法混淆 Angular 中的公共(public) JavaScript 文件(不是外部库)?

angular - NgbTypeahead selectItem 获取点击项 ngBootstrap angular2

javascript - 三个JS导出Blender模型和动画变形

javascript - 对象字面量/初始化程序中的自引用

android - 关闭 web 输入类型 = 文本的 android 单词建议

angular - 更新 Angular 后无法在 Chrome 中调试 typescript 文件