Angular 7上未显示物化模态答案

【问题标题】：Materialize Modal not displayed on Angular 7Angular 7上未显示物化模态
【发布时间】：2018-11-24 19:03:41
【问题描述】：

我一直在尝试从物化中显示模态的多种方法。我已经完成了所有设置materialize的steps。

一切似乎都很好，因为我正在使用图标。

我最终关注了this tutorial，但在 2:40 他的模式打开了，我的没有。

与他的项目和我的项目的唯一区别是我通过 NPM 安装了 materialize 并且我使用的是 Angular 7。我没有其他包。 Angular 7 有什么东西会干扰不打开我的模态吗？

感谢您的帮助。您可以在下面的 Angular 模板中找到代码。我没有收到任何错误，但模式没有打开。

<div class="container">
    <h2>Modals</h2>

    <a href="#terms" class="btn orange modal-trigger">Terms & conditions</a>

    <div class="modal" id="terms">
        test
    </div>
</div>
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>

<!-- Compiled and minified JavaScript -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/js/materialize.min.js"></script>
<script>
    $(document).ready(function () {
        $('.modal').modal();
    });
</script>

【问题讨论】：

您应该包含您的代码和在您的问题中重现问题的步骤，而不是链接到视频。另外，你有什么错误吗？
@GCSDC，我粘贴了一个链接而不是我的代码（facepalm）。感谢您的评论！
Angular 带有Material。我强烈建议将其用于模态；它开箱即用，无需加载 jquery。

标签： angular modal-dialog materialize angular7

【解决方案1】：

在你的 Index.html 中写下这段代码

<script>
  document.addEventListener('DOMContentLoaded', function () {

    var elems = document.querySelectorAll('.modal');
    var instances = M.Modal.init(elems);
  });

</script>

我希望这能解决您的问题

【讨论】：