如何让 mat-toolbar 响应 Angular 的变化？

Question

我一直在尝试为主页制作一个基本的标题，一段时间以来我的 web 应用程序，我想使用 mat-toolbar，但它不会设置我想要的方式。 我的代码如下。

 .maintooly { background-color: rgba(0,0,0,.7) }

 <mat-toolbar color="primary" class="main-tooly"> <span id="product-name"> HOMEPAGE </span> <div class="vertical-line title-line"> | </div> </mat-toolbar>

这是一个淡化的例子，但基本上我试图在页面顶部添加一个标题，所以它看起来像这样：

但它看起来像这样：

总结：不能让标题中的项目并排显示，也不能让标题的颜色改变或真正做任何事情。

我到底做错了什么，我怎样才能做到这一点？

Answer 1

解决方案是将导入工具放入 app.module.ts 文件中。