小编Ved*_*817的帖子

我一直在研究制作一个角度指令,如果它有超过一定数量的字符(例如115),它会缩短段落或div.

我找不到任何对我有用的东西,我已经看过http://dotdotdot.frebsite.nl/,这对一些人有用,但我试图使用角度指令而不是JQuery的.

如果有人可以提供任何帮助,我将非常感激,我基本上是从想法中挖掘出来的.

这是我的视图设置方式:

<div class="Description"
<div class="Content">
    <div data-ng-bind-html="item.Description"></div>
</div>

我最初只是把它作为jquery就好了,但是不建议只使用jquery和angular

$(function () {

var maxHeight = 115;
var moretext = Localization.Shared.InstitutionProfileStrings.ShowMore();
var lesstext = Localization.Shared.InstitutionProfileStrings.ShowLess();
$('.__Description').each(function () {
    var content = $(this).find(".__Content");
    var anchor = $(this).find(".morelink");

    if ($(content).height() > maxHeight) {
        $(this).addClass("less");
        $(anchor).html(moretext);
        $(anchor).show();
    }
    else {
        $(anchor).hide();
    }
});
$(".morelink").click(function (e) {
    e.preventDefault();
    var parent = this.parentElement;
    if ($(parent).hasClass("less")) {
        $(parent).removeClass("less");
        $(this).html(lesstext);
        $(parent).addClass("more");
    }
    else if ($(parent).hasClass("more")) {
        $(parent).removeClass("more");
        $(this).html(moretext);
        $(parent).addClass("less"); …

我从一个项目列表中获取一个字符串,该字符串当前显示为"item.ItemDescription"(下面的第9行)

我想从这个字符串中删除所有 html.在删除html后设置字符限制为250.有一个简单的方法吗？我看到有帖子说要安装HTML Agility Pack,但我正在寻找更简单的东西.

编辑:
它并不总是包含html,如果客户想要在描述中的项目名称中添加粗体或斜体标签,它会显示为<"strong">项目名称<"/ strong">,例如,我想要无论输入什么,都要删除所有html.

<tbody>
    @foreach (var itemin Model.itemList)
    {
        <tr id="@("__filterItem_" + item.EntityId + "_" + item.EntityTypeId)">
            <td>
                @Html.ActionLink(item.ItemName, "Details", "Item", new { id = item.EntityId }, null)
            </td>
            <td>
                item.ItemDescription
            </td>
            <td>
                @if (Model.IsOwner)
                {
                    <a class="btnDelete" title="Delete" itemid="@(item.EntityId)" entitytype="@item.EntityTypeId" filterid="@Model.Id">Delete</a>
                }
            </td>

        </tr>
    }
</tbody>