如何使用css和angular7动态显示文本省略？

要使用CSS和Angular 7动态显示文本省略，可以采用以下步骤：

1. 在HTML模板中，使用Angular的插值表达式将文本绑定到一个元素上，例如：

<p>{{ dynamicText }}</p>

1. 在CSS样式文件中，为该元素添加样式以实现文本省略，例如：

p {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

这些CSS属性将使文本在超出元素宽度时自动省略，并在末尾显示省略号。

1. 在Angular组件中，定义一个变量来存储动态文本，例如：

dynamicText: string = "这是一段动态文本，可能会很长";

1. 使用Angular的生命周期钩子或其他适当的方法，根据需要更新dynamicText变量的值。

这样，当dynamicText的值发生变化时，文本将自动根据CSS样式进行省略显示。

关于Angular 7和CSS的更多详细信息，可以参考以下链接：

• Angular官方文档：https://angular.io/
• CSS文本省略：https://developer.mozilla.org/zh-CN/docs/Web/CSS/text-overflow
• CSS白空间处理：https://developer.mozilla.org/zh-CN/docs/Web/CSS/white-space