动态操作AngularJS中的DOM元素

我有要求使用AngularJS呈现我的数据库中的所有帖子。我需要为每个用户可见的帖子提供编辑功能。目前，我正在通过使用'edit-post'指令来做到这一点。这是链接功能。动态操作AngularJS中的DOM元素

link: function ($scope, element, attrs) { 
      element.bind('click', function() { 
       var divId = $scope.$parent.post.meta.id + "Data"; 

       var html = $compile("<div class='editTextAreaDiv' id='" + divId + "'>" + 
          "<textarea class='editTextArea' id='editBox' rows='3' ng-model='editedPostText' name='editedPostText'>" + $scope.$parent.post.meta.data + "</textarea><br />" + 

          "<span class='pull-right'>" + 
           "<input class='btn' type='button' value='Save' ng-click='saveEditedPost(\"" + divId + "\")'/>" + 
           "<input class='btn' type='button' value='Cancel' ng-click='cancelEdit(\"" + divId + "\")'/>" + 
          "</span>" + 
         "</div>")($scope); 
       $("#" + divId).html(html); 
      }); 

}

我正在通过动态添加一个textarea和2个按钮来操作DOM。

我的问题是这种动态操作DOM元素的方法在Angular世界中是否可取。或者我应该采取其他方法（如使用ng-show/ng-hide指令显示/隐藏textarea和2个按钮）。

注意：由于我不想为每个帖子引入额外的textarea和2个按钮，我宁愿不要使用ng-show/ng-hide。

请指导我这一点。

来源

2013-12-09 Adarsh Konchady