title: Materializecss select not working with angular 5
body: <p>I am getting data from the server and filling an array. With that array I fill the <code>&lt;option&gt;</code> of a <code>&lt;select&gt;</code> but materializecss is not showing it properly.</p>
  
  <p>As you can see I am following the tip of materializecss of dinamic loading:</p>
  
  <blockquote>
    <p>You must initialize the select element as shown below. In addition, you will need a separate call for any dynamically generated select elements your page generates. <a href="http://next.materializecss.com/select.html" rel="nofollow noreferrer">http://next.materializecss.com/select.html</a></p>
  </blockquote>
  
  <p><strong>category-selector.component.ts</strong></p>
  
  <pre><code>export class CategorySelectorComponent implements OnInit {
  
    constructor(private categoryService: CategoryService) { }
  
    categories = [];
  
    ngOnInit() {
      this.enableSelect();
      this.categoryService.getCategories().subscribe(
        (result)=&gt; {
          this.loadCategories(result);        
        },
        (error) =&gt; {
          console.log(error);
        }
      )
    }
  
    private enableSelect() {
      var elem = document.getElementById('select_categories');
      var instance = M.Select.init(elem, {});    
    }
  
    private loadCategories(categories: Category[]) {
      categories.forEach(
        (category) =&gt; {
          this.categories.push(category);
        }
      );
      this.enableSelect();
    }
  
  }
  </code></pre>
  
  <p><strong>category-selector.component.html</strong></p>
  
  <pre><code>&lt;h5&gt;Select category&lt;/h5&gt;
  &lt;div class="input-field col s12"&gt;
      &lt;select id="select_categories"&gt;
        &lt;option *ngFor="let category of categories" value="{{category}}"&gt;
          {{category.name}}
        &lt;/option&gt;
      &lt;/select&gt;
      &lt;label&gt;Category&lt;/label&gt;
    &lt;/div&gt;
  </code></pre>