当ng-if变为真时，元素的DOM存在？

Question

我对angularjs很新。

我正在使用ng-if来隐藏/显示html代码的部分

<div ng-if="editing">
    <textarea id="editor" ng-model="longtext"></textarea>
</div>

我正在尝试访问textarea的DOM来修改它（使用CKeditor）。

$scope.edit=function(){
    $scope.editing = true
    $("#editor").ckEditor({})
}

问题是此时textarea不存在。 我可以使用setTimeout并且它可以工作，但我认为这不是一个干净的方法。 如何以更清洁的方式做到这一点？

我在这里做了小提琴http://jsfiddle.net/wxB36/2/（我使用addClass而不是ckEditor）。

Answer 1

您可以改为使用ng-show：

<textarea id="editor" ng-model="longtext" ng-show="editing"></textarea>

区别在于textarea始终在DOM中，但在$scope.editing为false时由CSS隐藏。

Answer 2

执行此操作的最佳方法是将ckeditor包装在指令中，因为它是一个可重用的组件，需要执行自己的DOM操作和事件。

看起来这里有already a project on github。

如果您使用该指令，则ng-if将正常工作。