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

我是一名

AngularJS

新手，试图通过单击

按钮

来动态创建一个

textarea

。我使用的是

ngSanitize

插件，代码可以工作，我可以插入带有一些文本的纯

div

s，但是当要创建

textarea

时，它就不能工作了。元素甚至没有显示

HTML:

回复

JS（角度控制器）

app.controller（'messagesReadController'，函数（$scope）{
$scope.insertReplyBox=函数（）{
console.log（“点击回复”）；
$scope.replyBoxHTML='thiscope！！'；
$scope.replyBoxHTML1=''；//这不起作用
}
});

---

（我已经在另一个文件中添加了

ngSanitize

依赖项，所以这里没有显示。）

我认为您的做法是错误的，使用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时，您应该避免这样使用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>

回复

使用不安全的

var-app=angular.module（'myApp'，[]）；
app.controller（'messagesReadController'，函数（$scope）{
$scope.insertReplyBox=函数（）{
console.log（“点击回复”）；
$scope.replyBoxHTML='thiscope！！'；
$scope.replyBoxHTML1=''；//这不起作用
}
});
应用过滤器（“不安全”，功能（$sce）{
返回函数（val）{
返回$sce.trustAsHtml（val）；
};
});

回复


使用不安全的


var-app=angular.module（'myApp'，[]）；
app.controller（'messagesReadController'，函数（$scope）{
$scope.insertReplyBox=函数（）{
console.log（“点击回复”）；
$scope.replyBoxHTML='thiscope！！'；
$scope.replyBoxHTML1=''；//这不起作用
}
});
应用过滤器（“不安全”，功能（$sce）{
返回函数（val）{
返回$sce.trustAsHtml（val）；
};
});

回复


您能创建示例plunkr吗？您能创建示例plunkr吗？这实现了我的目标，并且非常容易实现\理解。你能解释一下为什么不建议使用DOM元素吗？angularjs提供了前端开发的一种新思路，几乎总是有一种不注入代码就可以做你想做的事情的方法，你的控制器内部不应该有html。我不清楚，这很难解释，但你很快就会明白的。我认为这实现了我的目标，而且很容易实现\理解。你能解释一下为什么不建议使用DOM元素吗？angularjs提供了前端开发的一种新思路，几乎总是有一种不注入代码就可以做你想做的事情的方法，你的控制器内部不应该有html。我不清楚，这很难解释，但你很快就会明白。我想你能解释一下使用这种方法是什么意思吗？你能解释一下使用这种方法是什么意思吗？
<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>