Question

＆lt; p＆gt;我＆lt; code＆gt; AngularJS＆lt; / code＆gt; newbie并尝试动态创建＆lt; code＆gt; textarea＆lt; / code＆gt;在＆lt; code＆gt;按钮＆lt; / code＆gt;上单击。我正在使用＆lt; code＆gt; ngSanitize＆lt; / code＆gt;插件，代码可以工作，我可以插入带有一些文字的简单＆lt; code＆gt; div＆lt; / code＆gt;，但是当问题来创建一个＆lt; code＆gt; textarea＆lt; / code＆gt;它只是赢了工作。该元素甚至不显示。＆lt; / p＆gt; ＆LT; p为H. HTML：其中/ p为H. ＆lt; pre＆gt;＆lt; code＆gt;＆lt; button class =＆＃34; btn bg-info＆＃34;纳克单击=＆＃34; insertReplyBox（）＆＃34;＆GT;回复＆LT; /按钮＆GT; ＆LT峰; br＆GT; ＆lt; div class =＆＃34; row＆＃34;＆gt; ＆lt; div class =＆＃34; col-lg-2＆＃34; ID =＆＃34; replyBox＆＃34;＆GT; ＆lt; div ng-bind-html =＆＃34; replyBoxHTML＆＃34;＆gt;＆lt; / div＆gt; ＆lt; div ng-bind-html =＆＃34; replyBoxHTML1＆＃34;＆gt;＆lt; / div＆gt; ＆LT; / DIV＆GT; ＆LT; / DIV＆GT; ＆LT; /代码＆GT;＆LT; /预＆GT; ＆lt; p＆gt; JS（角度控制器）＆lt; / p＆gt; ＆lt; pre＆gt;＆lt; code＆gt; app.controller（＆＃39; messagesReadController＆＃39;，function（$ scope）{ $ scope.insertReplyBox = function（）{ console.log（＆＃34;点击回复＆＃34;）; $ scope.replyBoxHTML =＆＃39;＆lt; div＆gt;这适用!!＆lt; / div＆gt;＆＃39 ;; $ scope.replyBoxHTML1 =＆＃39;＆lt; textarea col =＆＃34; 4＆＃34;行=＆＃34; 20＆＃34;占位符=＆＃34;占位符＆＃34;＆GT;＆LT; / textarea的＆GT;＆＃39 ;; //这不起作用 } }）; ＆LT; /代码＆GT;＆LT; /预＆GT; ＆lt; p＆gt;（我已将＆lt; code＆gt; ngSanitize＆lt; / code＆gt;依赖项添加到另一个文件中，因此它不会在此处显示。）＆lt; / p＆gt;

Answer 1

使用不安全的

＆＃13;

<!DOCTYPE html>
<html>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<body>

<div ng-app="myApp" ng-controller="messagesReadController">

<button class="btn bg-info" ng-click="insertReplyBox()">Reply</button>
<br>
<div class="row">
  <div class="col-lg-2" id="replyBox">
    <div ng-bind-html="replyBoxHTML"></div>
    <div ng-bind-html="replyBoxHTML1| unsafe"   ></div>
  </div>
</div>

 

</body>
</html>

＆＃13;

{{1}}

＆＃13;

Answer 2

我认为你的做法是错误的，使用angularJS你应该避免最大限度地使用DOM（指令除外）

这个怎么样？

<button class="btn bg-info" ng-click="textareashow = !textareashow">Reply</button>
 <br>
 <div class="row" ng-show="textareashow">
   <div class="col-lg-2" id="replyBox">
     <textarea col="4" row="20" placeholder="placeholder"></textarea>
   </div>
 </div>

AngularJS - 使用ngSanitize动态创建<textarea>不显示（其他元素）

2 个答案: