Выбор из angular2-материала не работает при загрузке данных из наблюдаемой

Question

У меня проблемы с попыткой загрузить опции выбора с данными из наблюдаемой.

Код моего компонента:

declare var $: any;

@Component({
  selector: 'app-home-page-eventos',
  templateUrl: './home-page-eventos.component.html',
  styleUrls: ['./home-page-eventos.component.css']
})
export class HomePageEventosComponent implements OnInit {
  ngOnInit() {
    $(document).ready(function() {
      $('select').material_select();
    });
  }
}

Мой HTML-шаблон выглядит так:

<div class="col l2 m2 s6 input-field">
  <select class="home-page-select home-page-eventos-select" materialize="material_select">
    <option value="" disabled selected>Estado</option>
    <option value="">São Paulo</option>
    <option value="">Rio de Janeiro</option>
    <option [value]="state.name" 
            *ngFor="let state of (responseStates$ | async)">
       {{state.name}}
    </option>
  </select>
</div>

Наблюдаемый $ responseStates извлекает данные, как и ожидалось, и если я проверяю HTML, сгенерированный в браузере, я вижу полностью заполненный выбор с ожидаемыми данными. Но эти данные не загружаются в выпадающем списке выбора на экране.

Я читал, что функция material_select () устарела и теперь должна использовать функцию formSelect (). Однако, когда я делаю эту замену, я получаю сообщения об ошибках в консоли, в которых говорится, что функция formSelect не может быть найдена в файле materialize.js, и на самом деле, когда я захожу в файл, я могу найти только функцию material_select ().

Я использую версию 15.1.10 пакета angular2-materialize.