Warning: file_get_contents(/data/phpspider/zhask/data//catemap/1/angular/26.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 错误类型错误:无法读取属性';长度';未定义在Object.updateDirectives的_Javascript_Angular - Fatal编程技术网

Javascript 错误类型错误:无法读取属性';长度';未定义在Object.updateDirectives的

Javascript 错误类型错误:无法读取属性';长度';未定义在Object.updateDirectives的,javascript,angular,Javascript,Angular,我有一个角度8应用程序。如果加载了某个组件,我会得到一个错误 无法读取未定义的属性“length” 我在谷歌上搜索了很多,还做了一些教程。但是我不知道如何处理这个错误 因此,如果我加载此组件: import { Component, OnInit } from '@angular/core'; import { HealthAPIService } from '../../shared/health-api/health-api.service'; import { DossierEntry

我有一个角度8应用程序。如果加载了某个组件,我会得到一个错误

无法读取未定义的属性“length”

我在谷歌上搜索了很多,还做了一些教程。但是我不知道如何处理这个错误

因此,如果我加载此组件:

import { Component, OnInit } from '@angular/core';
import { HealthAPIService } from '../../shared/health-api/health-api.service';

import { DossierEntry } from '../../interfaces/dossier/dossier-entry.interface';

@Component({
  selector: 'app-dossier-correspondence',
  templateUrl: './dossier-correspondence.component.html',
})

export class DossierCorrespondenceComponent implements OnInit {
  allCorrespondence: Array<DossierEntry>;
  correspondenceEntries: Array<DossierEntry>;
  attachmentEntries: Array<DossierEntry>;
  message = '';
  emptyMessage = 'Geen correspondentie.';
  errorMessage = 'Er ging iets mis met de connectie. Probeer over enkele minuten nogmaals.';

  correspondenceLoaded = false;
  showingSingle = false;

  single: DossierEntry;

  constructor(private healthAPIService: HealthAPIService) {}

  handleCorrespondenceLoad(result) {
    if (result &&  result.length === 0) {
      this.message = this.emptyMessage;
      return;
    }
    this.allCorrespondence = result;
    this.attachmentEntries = [];
    this.correspondenceEntries = [];
    for (let entry of result) {
      switch (entry.type) {
        case 'correspondence': {
          this.correspondenceEntries.push(entry);
          break;
        }
        case 'attachments': {
          this.attachmentEntries.push(entry);
          break;
        }
        default: {
          console.log('Dossier correspondence heeft een invalide entry soort teruggegeven');
          break;
        }
      }
    }
  }

  gotoItem(index, type: string) {
    this.showingSingle = true;
    // this.single = this.allCorrespondence[index];
    switch (type) {
      case 'correspondence': {
        this.single = this.correspondenceEntries[index];
        break;
      }
      case 'attachments': {
        this.single = this.attachmentEntries[index];
        break;
      }
      default: {
        console.log('Er is op een ongeldige soort dossier entry geklikt');
        break;
      }
    }
  }

  goBack(event) {
    this.showingSingle = false;
  }

  ngOnInit() {
    this.healthAPIService.getDossierEntry('correspondence').subscribe(result => {
      console.log(result);
      this.handleCorrespondenceLoad(result), (this.correspondenceLoaded = true);
    }, msg => (this.message = this.errorMessage));
  }
}


export class IsLoadingComponent implements OnInit {
  @Input() message: string;

  public text: string;

  constructor() {}

  ngOnInit() {
    this.text = this.message + '...';
  }
}
在这一行:

<app-is-loading *ngIf="!correspondenceLoaded" message="Correspondentie wordt geladen"></app-is-loading>

<div *ngIf="!showingSingle && correspondenceEntries && correspondenceEntries.length > 0">
多谢各位

现在还有html文件:

<app-vital10-page [noTopBar]="true">
<h2 class="section-header">Correspondentie</h2>

<p class="data-entry" *ngIf="!allCorrespondence">{{ message }}</p>

<app-is-loading *ngIf="!correspondenceLoaded" message="Correspondentie wordt geladen"></app-is-loading>

<div *ngIf="!showingSingle && correspondenceEntries.length > 0">
  <div class="main-row main-row-dossier">
    <section class="data-entry">
      <h3 class="dossier-header">Algemeen</h3>
      <table class="dossier-table">
        <thead class="dossier-tableheader">
          <tr>
            <th class="dossier-tablehead fixed-one-fifth">Datum</th>
            <th class="dossier-tablehead fixed-four-fifths">Onderwerp</th>
          </tr>
        </thead>
        <tbody class="dossier-tablebody">
          <tr class="dossier-correspondencerow" *ngFor="let entry of correspondenceEntries; let i = index" (click)="gotoItem(i, entry.type)">
            <td>{{ entry.date | date:"dd-MM-y" }}</td>
            <td>{{ entry.name }}</td>
          </tr>
        </tbody>
      </table>
    </section>
  </div>
</div>

<div *ngIf="!showingSingle && attachmentEntries.length > 0">
  <div class="main-row main-row-dossier">
    <section class="data-entry">
      <h3 class="dossier-header">Bijlage</h3>
      <table class="dossier-table">
        <thead class="dossier-tableheader">
        <tr>
          <th class="dossier-tablehead fixed-one-fifth">Datum</th>
          <th class="dossier-tablehead fixed-four-fifths">Onderwerp</th>
        </tr>
        </thead>
        <tbody class="dossier-tablebody">
        <tr class="dossier-correspondencerow" *ngFor="let entry of attachmentEntries; let i = index" (click)="gotoItem(i, entry.type)">
          <td>{{ entry.date | date:"dd-MM-y" }}</td>
          <td>{{ entry.name }}</td>
        </tr>
        </tbody>
      </table>
    </section>
  </div>
</div>

<app-dossier-correspondence-item
  [item]="single"
  (goBack)="goBack($event)"
  *ngIf="showingSingle">
</app-dossier-correspondence-item>
</app-vital10-page>


尝试从更改模板片段

<app-is-loading *ngIf="!correspondenceLoaded" message="Correspondentie wordt geladen"></app-is-loading>

<div *ngIf="!showingSingle && correspondenceEntries.length > 0">



似乎您正在尝试访问
对应条目。长度
尚未定义时

您可以发布您的模板代码吗?我更新了post,因此无法修复它。更新后的错误仍然相同?我还包括整个html文件OHHHH。这是另一个ngIf:现在它起作用了。谢谢你,睁开了我的眼睛!
<app-vital10-page [noTopBar]="true">
<h2 class="section-header">Correspondentie</h2>

<p class="data-entry" *ngIf="!allCorrespondence">{{ message }}</p>

<app-is-loading *ngIf="!correspondenceLoaded" message="Correspondentie wordt geladen"></app-is-loading>

<div *ngIf="!showingSingle && correspondenceEntries && correspondenceEntries.length > 0">
  <div class="main-row main-row-dossier">
    <section class="data-entry">
      <h3 class="dossier-header">Algemeen</h3>
      <table class="dossier-table">
        <thead class="dossier-tableheader">
          <tr>
            <th class="dossier-tablehead fixed-one-fifth">Datum</th>
            <th class="dossier-tablehead fixed-four-fifths">Onderwerp</th>
          </tr>
        </thead>
        <tbody class="dossier-tablebody">
          <tr class="dossier-correspondencerow" *ngFor="let entry of correspondenceEntries; let i = index" (click)="gotoItem(i, entry.type)">
            <td>{{ entry.date | date:"dd-MM-y" }}</td>
            <td>{{ entry.name }}</td>
          </tr>
        </tbody>
      </table>
    </section>
  </div>
</div>

<div *ngIf="!showingSingle && attachmentEntries.length > 0">
  <div class="main-row main-row-dossier">
    <section class="data-entry">
      <h3 class="dossier-header">Bijlage</h3>
      <table class="dossier-table">
        <thead class="dossier-tableheader">
        <tr>
          <th class="dossier-tablehead fixed-one-fifth">Datum</th>
          <th class="dossier-tablehead fixed-four-fifths">Onderwerp</th>
        </tr>
        </thead>
        <tbody class="dossier-tablebody">
        <tr class="dossier-correspondencerow" *ngFor="let entry of attachmentEntries; let i = index" (click)="gotoItem(i, entry.type)">
          <td>{{ entry.date | date:"dd-MM-y" }}</td>
          <td>{{ entry.name }}</td>
        </tr>
        </tbody>
      </table>
    </section>
  </div>
</div>

<app-dossier-correspondence-item
  [item]="single"
  (goBack)="goBack($event)"
  *ngIf="showingSingle">
</app-dossier-correspondence-item>
</app-vital10-page>
dossier-correspondence.component.html:8 ERROR TypeError: Cannot read property 'length' of undefined
    at Object.updateDirectives (dossier-correspondence.component.html:30)
    at Object.debugUpdateDirectives [as updateDirectives] (core.js:30537)
    at checkAndUpdateView (core.js:29933)
    at callViewAction (core.js:30174)
    at execComponentViewsAction (core.js:30116)
    at checkAndUpdateView (core.js:29939)
    at callViewAction (core.js:30174)
    at execEmbeddedViewsAction (core.js:30137)
    at checkAndUpdateView (core.js:29934)
    at callViewAction (core.js:30174)
<app-is-loading *ngIf="!correspondenceLoaded" message="Correspondentie wordt geladen"></app-is-loading>

<div *ngIf="!showingSingle && correspondenceEntries.length > 0">
<app-is-loading *ngIf="!correspondenceLoaded" message="Correspondentie wordt geladen"></app-is-loading>

<div *ngIf="!showingSingle && correspondenceEntries && correspondenceEntries.length > 0">