具有物化的角度2模态不会打开

时间:2017-07-23 17:59:23

标签: angular typescript

我试图在组件加载时打开一个模态,但没有任何东西出现,我不明白为什么。任何帮助都会很棒。

component.html:

<div id="modal" class="modal modal-fixed-footer" materialize="modal" [materializeActions]="actions">
  <div class="modal-content">
    <h4>Modal Header</h4>
    <p>A bunch of text</p>
  </div>
  <div class="modal-footer">
    <a href="#!" class="modal-action modal-close waves-effect waves-green btn-flat ">Agree</a>
  </div>
</div>

component.ts:

import { Component, OnInit, EventEmitter, AfterViewInit } from '@angular/core';
import { QuizService } from '../services/quiz.service';
import { Answer, Question, Quiz } from '../models/index';
import {MaterializeAction, MaterializeDirective, MaterializeModule} from "angular2-materialize";
import "materialize-css";

@Component({
  selector: 'app-quiz',
  templateUrl: './quiz.component.html',
  styleUrls: ['./quiz.component.sass'],
  providers: [QuizService]
})
export class QuizComponent implements OnInit, AfterViewInit {

  actions = new EventEmitter<string|MaterializeAction>();
  quiz: Quiz = new Quiz(null);
  pager = {
    index: 0,
    size: 1,
    count: 1
  };
  selections: [string]

  constructor(private quizService: QuizService) { }

  ngOnInit() {
  }

  ngAfterViewInit() {
    this.openModal()
  }

  openModal() {
    this.actions.emit({action:"modal",params:['open']});
  }
}

我已经尝试了谷歌搜索,并弄清楚我失踪了什么。任何帮助都会很棒

1 个答案:

答案 0 :(得分:0)

这不适合我的原因是因为我将它作为一个模态呈现,但它被链接为一个新的路径与新的页面。所以一旦我删除了这个链接,模态就可以了。