*ngFor Uncaught TypeError: Cannot read property 'classList' of null

Question

I have the follow array in Angular inside my component:

pages: [
    {
        link: "link",
        name: "name",
        img: "imgPath" ,
        desc: "description"
    }, {...

and I am trying to use it to display a list with the follow code in the DOM:

    <div *ngFor="let page of pages"  class="col-md-4 col-sm-6 portfolio-item">
    <a href="{{page.link}}" class="portfolio-link" data-toggle="modal">
      <div class="portfolio-hover">
        <div class="portfolio-hover-content">
          <i class="fa fa-plus fa-3x"></i>
        </div>
      </div>
      <img src="{{page.img}}" class="img-responsive" alt="">
    </a>
    <div class="portfolio-caption">
      <h4>{{page.name}}</h4>
      <p class="text-muted">{{page.desc}}</p>
    </div>
  </div>

and I'm receiving the follow error:

zone.js:192 Uncaught TypeError: Cannot read property 'classList' of null

How can I solve this?

Yes, it is in the scope, it is like the array was not loaded when I try to use it in the DOM — gui_s3
I can't found anything related to classList in your code. classList is a DOM property object to use add, remove class from DOM, so I can't found anything related classList. Can you share "zone.js" entirely? — Hanif

greg95000 greg95000 · Accepted Answer · 2018-01-21T19:34:26

0

votes

Try to replace pages: to pages=

*ngFor Uncaught TypeError: Cannot read property 'classList' of null

1 Answers