Angular Bootstrap 模态不缩放答案

【问题标题】：Angular Bootstrap Modal not ScalingAngular Bootstrap 模态不缩放
【发布时间】：2016-02-17 03:31:25
【问题描述】：

我已经实现了一个模态：

<script type="text/ng-template" id="myModalContent.html">
    <div class="modal-header">
        <button class="close" type="button" ng-click="cancel()">&times;</button>

    </div>
    <div class="modal-body">
        <h3>asjdkljasldjal;sdjakl;djal;jqwjeo8qajeoqjeoqoweuq90euq0uew0qjwe09quwe9qu0equ09weu8q90uwe0que98que9quew89que9quw9eq9weuq98eualsnkdakjsd</h3>
    </div>
</script>

但是，如图所示，该框并未随文本缩放：

从角度引导文档中，这些东西应该会自动缩放。我需要启用一个选项吗？还是我在实施过程中遗漏了什么？

【问题讨论】：

问题在于你的长而不间断的文本行
见css-tricks.com/snippets/css/…
@Phil 我以一个大字符串为例。我的实际内容不仅仅是一个字符串。它可以是视频或图像。有没有办法让模态扩展以满足其内容？
据我所知没有。模态宽度由size 属性决定，该属性与所应用的 CSS 类直接相关。你也许可以用 CSS 做一些事情，但我怀疑这会很容易。是什么让您相信它会动态扩展？
@Phil 如果您访问 angular bootstrap 网站：angular-ui.github.io/bootstrap 并查看他们的模态，它会随文本/图像/您扔给它的任何内容缩放

标签： angularjs html angular-ui-bootstrap

【解决方案1】：

试试这个 CSS：word-wrap: break-word; 在你的长词上。

http://www.w3schools.com/cssref/css3_pr_word-wrap.asp http://www.w3schools.com/cssref/tryit.asp?filename=trycss3_word-wrap

【讨论】：

我以大字符串为例。如果我说，使用视频或图像，模态也不会拉伸
这有帮助吗：stackoverflow.com/questions/16152275/…
我看到了这个问题，但是，角度引导程序和 jquery 不能很好地配合使用。见scotch.io/tutorials/…
我同意。但是你根本不需要 Jquery。我们可以使用 element.addEventListener 在纯 Javascript 中添加事件监听器