在 AngularJs 中使用指令创建读取更多/更少切换

Create read more/less toggle using directive in AngularJs.

本文关键字：读取 创建 AngularJs 指令      更新时间：2023-09-26

我的页面上有几行描述。在页面加载时，我只想显示 150 个字符，其中包含一个链接 阅读更多 单击该链接，我想显示其余的描述和"少读"链接。事实上，我想在阅读更多/更少之间切换。我想通过创建一个指令而不是使用 AngularJs 提供的 limitTo 过滤器来做到这一点。我已经通过链接创建阅读更多链接在 AngularJS 中，但它对我没有帮助。我没有代码示例或jsfiddle，因为我不知道如何开始，我是AngularJs的新手。任何帮助将不胜感激。提前谢谢。

我用

一个简单的 Angular 指令包装 jQuery dotdotdot 取得了巨大的成功。我不能放入确切的代码，但指令的核心：

  • 是一个A（属性）指令
  • 需要ngBindHtml
  • 具有链接功能：
    • 设置$scope.truncated变量以跟踪是否已应用dotdotdot的位置
    • 监视element.html()更改，如果更改且尚未应用dotdotdot，则通过调用element.dotdotdot()并翻转truncated标志来应用它
相关文章：