javascript - 用 Angular 形将文本换成圆形并限制字符串长度

我对angular很陌生，我正试图将输入字段中的文本包装成圆形div，这样文本就不会超出边界。任何帮助将非常感谢这里是我的代码-谢谢！
HTML格式：

<div ng-app>
    Add Information <textarea ng-model ="input" maxlength = "120" class = "textinput" </textarea>

     <div class="textcircle">
        <span id="text">{{input}}</span>
     </div>
</div>

CSS:

    .textinput{
    height: 15%;
    width: 40%;
    margin-left: 5px;
}
.textcircle{
    width:200px;
    height: 200px;
    border-radius: 1000px;
    border: 1px solid #888080;
    box-shadow: 1px 1px 1px 1px;
    text-align: center;
    font-size: 18px;
    font-family: Museo-Sans;
    font-weight: 300;
}
#text{
    padding: 1em;
    text-align: center;
    margin-left: 10px;
    margin-right: 10px;
    display: block;
}

更新-我已经更改了HTML/CSS，并使文本能够很好地环绕圆圈，但是如果一个单词太长，它会移到圆圈之外。有没有办法限制div中单词的长度？
看这个小提琴的例子：
http://jsfiddle.net/Gj7tL/16/

最佳答案

这应该管用！
http://jsfiddle.net/D2TL3/
基本上需要将<span>更改为<div>以进行文本换行。为#text创建一个要用其包装的内圈。
祝你好运！

关于javascript - 用 Angular 形将文本换成圆形并限制字符串长度，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/21465763/