如何用angular 8实现物化导航栏

我是angular的新手，我通过以下方式向angular应用程序添加了materialize框架

npm install materialize-css --save 
npm install jquery --save
npm install --save hammerjs

我的问题是如何在angular中实现materialize navbar？到目前为止，我一直尝试的是：

<ul id="dropdown1" class="dropdown-content">
    <li><a href="#!">one</a></li>
    <li><a href="#!">two</a></li>
    <li class="divider"></li>
    <li><a href="#!">three</a></li>
  </ul>
  <nav>
    <div class="nav-wrapper">
      <a href="#!" class="brand-logo">Logo</a>
      <ul class="right hide-on-med-and-down">
        <li><a href="sass.html">Sass</a></li>
        <li><a href="badges.html">Components</a></li>
        <!-- Dropdown Trigger -->
        <li><a class="dropdown-trigger" href="#!" data-target="dropdown1">Dropdown<i class="material-icons right">arrow_drop_down</i></a></li>
      </ul>
    </div>
  </nav>

<script>
  document.addEventListener('DOMContentLoaded', function () {
    var elems = document.querySelectorAll('.dropdown-trigger');
    var instances = M.Dropdown.init(elems, options);
  });

</script>

document.addEventListener（'DOMContentLoaded'，函数（）{
var elems=document.querySelectorAll（'.dropdownttrigger'）；
var实例=M.Dropdown.init（元素，选项）；
});

但是它不起作用，我也尝试过这样的jquery

<script type="text/javascript" src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
  <script type="text/javascript" src="js/materialize.min.js"></script>
  <script>
    $(document).ready(function () {
$(".dropdown-trigger").dropdown();

    });
  </script>

$（文档）.ready（函数（）{
$（“.dropdown触发器”）.dropdown（）；
});

我建议使用。

在该部分中，您可以找到几个材质组件，如，可以用作主导航条

最简单的示例如下所示：

<mat-menu #appMenu="matMenu">
  <button mat-menu-item>Settings</button>
  <button mat-menu-item>Help</button>
</mat-menu>

<button mat-icon-button [matMenuTriggerFor]="appMenu">
  <mat-icon>more_vert</mat-icon>
</button>

---

如果你使用的是Angular，你不需要具体化，你只需要使用Material，我应该为css做什么@如果我使用角度材质，我应该为css做什么？我的意思是，对于具体化的类，为角度主题化提供了指南：|自定义组件样式：

export class NameComponent implements OnInit, AfterViewInit {
  ....

  ngAfterViewInit(): void {
    setTimeout( function() {
      var elem = document.querySelector('.sidenav');
      var instance = M.Sidenav.init(elem, options);
    }, 0)
  }

  .....

}