【问题标题】:put html DIV into a popover content angular UI将 html DIV 放入 popover 内容角度 UI
【发布时间】:2014-05-04 17:13:24
【问题描述】:

是否可以将 html 内容放入弹出框? 这是我需要放入弹出框的字符串

HTML

$scope.info="sentence " +
    "<ul>"+
    "<li>first list member</li>"+
        "<ul>"+
        "<li>element of the first list</li>"+
        "</ul>"+
    "</li>"+
    "<li>second element</li>"+
    "<ul>"+
        "<li id=\"infoLi\">element of the second</li>"+
    "</ul>"+
    "<li>third element</li>"+
    "<ul>"+
        "<li id=\"infoLi\">first element of the third</li>"+
        "<li id=\"infoLi\">second element of the third</li>"+
    "</ul>"+       
"</ul></div>"

我在 angular-ui-popover 的文档中看到,可以设置弹出框的选项,并且在网上看到有人说可以在此选项中设置参数HTML 为真并得到这个结果。
我没有找到任何样本,我不知道它是否属实,我尝试这样做的第一个问题是我不明白如何设置选项。
对我来说一个可能的解决方案是在弹出窗口中留下一个字符串,但我需要使用新的行标签,我发现它在弹出内容中不起作用。

编辑

也许我不是很清楚,我正在尝试使用 angular ui 和 ui bootstrap 来做到这一点。

【问题讨论】:

标签: angularjs twitter-bootstrap angular-ui angular-ui-bootstrap


【解决方案1】:

好的,我已经找到了一个解决方案,正如我所看到的,目前它不适用于弹出框,而对于工具提示是。

HTML

<button id="infobtn" tooltip-html-unsafe="<div>first list member
                                         <li>element of the first list</li>
                                         second element
                                         <li id='infoLi'>element of the second</li>
                                         third element
                                         <li id=\"infoLi\">first element of the third</li>
                                         <li id=\"infoLi\">second element of the third</li>
                                         </div>
    "tooltip-trigger="mouseenter">
    <img src="images/info.png"></button>

标签 tooltip-html-unsafe 可以插入 DIV 或其他任何 html,在工具提示内容中,我也尝试在弹出窗口中使用它,但由于某种原因它不起作用。我不知道是不是我做错了什么,所以我决定使用 ui.tooltip 模块,我已经解决了这个问题。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2021-08-20
    • 1970-01-01
    • 1970-01-01
    • 2016-08-01
    • 2018-12-19
    • 1970-01-01
    相关资源
    最近更新 更多