使用 angular limitTo 或 slice 或 filter 的多行文本字段

Question

我有一个 HTML 字段，它应该显示最近 to/from 您发送的短信的前几行，类似于 iphone 上的消息.我想要最多两行文本，第二行的末尾使用省略号截断。按照格式化的方式，我每行只能容纳 45 个字符。最好有一种方法可以正确地进行分词，但我还没有找到。

我还计划使用 ionic/cordova 构建它，所以我不能依赖纯粹的 css、scss 或任何其他 webkit 技巧，所以我正在尝试仅使用 angular 执行此操作。我真的很接近，但我无法得到它。

我的解决方案基本上是获取我的消息文本 {{message.text}}，并使用 limitTo 或 slice 方法获取返回数组文本的前 45 个字符，然后在它正下方的第二行，前 45 个字符之后的下一个 45 个字符。

                <div class="row row-center">
                    <div class="col" style="padding:0px">
                        <div style="">
                        {{ message.text | limitTo: 45 }}<br />
                        {{ message.text.slice(45,90) }}
                        {{ message.text.length > 45 ? '...' : ''}}
                        </div>
                    </div>
                </div>

我理解这里的问题，我使用的是同一组结果，第一行我得到前 45 个，第二行我得到前 90 个，然后从结束我要 46...我意识到这没有意义，但我觉得我很接近，任何指导表示赞赏。

编辑：我想我只是想通了，使用 slice（上面改变了）！现在有人知道如何逐字执行此操作吗？

Answer 1

为什么不能使用limitTo:90（为什么要将它用作两次 45？？？？）并在将显示消息的字段中启用自动换行。

在你的控制器中使用 limitTo，比如，

$filter('limitTo')(input, limit) 
$filter('limitTo')(message.text, 90) //In your case limit is 90

在你的情况下，前 45 个字符：$filter('limitTo')(message.text, 45) 接下来的 45 个字符：$filter('limitTo')($filter('limitTo')(message.text, 90),-45);

在 HTML 中：

{{message.text | limitTo:45}}
{{message.text | limitTo:90 | limitTo:-45}} //This will fetch first 90 characters and removes first 45 from it giving you next 45 characters

使用 angular limitTo 或 slice 或 filter 的多行文本字段

Multiline text field using angular limitTo or slice or filter

angularjs

cordova

ionic-framework