Angular md分隔器（垫分隔器）未在角材料2中显示

我使用

，比如

。 我认为像

这样使用也可以。 但是，

有时不显示

我在

中使用了

，但未显示

。 我应该只在

中使用

如果有人和我有同样的问题，请分享你解决这个问题的经验

这是我的密码

登录
要求的
这似乎不是有效的电子邮件地址。
电子邮件地址不正确。
要求的
你忘记密码了吗？
登录

更新：尝试垫式分隔器而不是md分隔器

试试这个css样式

md-divider {
    border-width: 1px;
    border-style: solid;
}

更新日期：2月18日 MatDivider被移到了自己的位置：

---

过时的答案

是

MdListModule

的一部分。如果要使用它，您需要在组件的模块中导入

MdListModule

，并且在模板中至少有

。如果您不使用列表，那么为分隔器导入整个模块可能会有些过分。只需使用您自己的样式重复使用

，如：

hr {
  display: block;
  margin: 10px 0 10px 0;
  border-top: 1px solid rgba(0, 0, 0, .12);
  width: 100%
}

请参见

从'@angular/material'导入{MdListModule}；
进口：[
MdListModule
],

这对我很有帮助

mat-divider {
    width: 100%;
}

一些细节：
它是一个具有以下HTML代码的角度组件：

<div class="container">
    <!---some header text-->

    <div class="content">
    <!---some crappy content-->
    </div>

    <mat-divider></mat-divider>   

    <div class = "actions">
        <!--couple of buttons-->
    </div>    
</div>

---

我也遇到了同样的问题，在github上有人建议移动

md divider

，尝试删除

flex

部分，只是想看看这是否是问题所在。似乎没有什么能解决这个问题。如果你有更好的运气，请发布它。注意，从当前版本开始，这不再是真的：@Jules谢谢你的提示，我已经更新了答案。现在是这样，你可以自己使用它（在md列表之外），不需要/devider。您可以这样导入它：从'@angular/material'导入{MatDividerModule}；如果你从角材料中导入更多的模块，它可以节省代码行

mat-divider {
    width: 100%;
}

<div class="container">
    <!---some header text-->

    <div class="content">
    <!---some crappy content-->
    </div>

    <mat-divider></mat-divider>   

    <div class = "actions">
        <!--couple of buttons-->
    </div>    
</div>

.container {
    display: flex;
    flex-direction: column;
    margin: 0 15px;
    align-items: flex-start;
}

.content {
    margin: 0 15px;
}

mat-divider {
    width: 100%;
}

.actions {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: flex-start;
    margin: 0px 15px;
}