We help IT Professionals succeed at work.

error in angular

chalie001
chalie001 asked
on
Medium Priority
111 Views
Last Modified: 2020-02-19
hi am having this error
doc
Comment
Watch Question

CERTIFIED EXPERT
Most Valuable Expert 2017
Distinguished Expert 2019

Commented:
The error is pretty clear.

It is saying in your PostListComponent.html file you are referencing the length property of a variable - which at the time the template is rendered is undefined.
What do PostListComponent.html and PostListComponent.ts look like?

Author

Commented:
this is it
<mat-accordion multi="true" *ngIf="posts.length > 0">
    <mat-expansion-panel *ngFor="let post of posts">
        <mat-expansion-panel-header>
        {{post.title}}
        </mat-expansion-panel-header>
       <p>{{post.content}}</p>
       <mat-action-row>
           <button mat-button color="primary">EDIT</button>
           <button mat-button color="warn">DELETE</button>
       </mat-action-row>
    </mat-expansion-panel>
</mat-accordion>
<p class="info-text mat-body-1" *ngIf="posts.length <= 0">no post added yet</p>

Open in new window

CERTIFIED EXPERT
Most Valuable Expert 2017
Distinguished Expert 2019
Commented:
If posts is undefined then this won't work
<mat-accordion multi="true" *ngIf="posts.length > 0">

Open in new window

Just do
<mat-accordion multi="true" *ngIf="posts">

Open in new window