Question

我在尝试检测$scope变量何时真正影响html时遇到问题。我需要在$ scope真正将更改应用到html之后访问该元素，但$scope.$watch没有做到这一点。

JS：

$scope.variable = "<p id='myElement'>Hello world!</p>";
console.log(jQuery('#myElement')[0]);

HTML：

<div ng-bind-html="varible | trustAsHtml"></div>

问题是，即使$scope正在应用新内容，该元素仍然不存在，jQuery返回undefined，所以我需要等待直到$scope确实将更改应用于html。

我知道解决方案可能是$timeout，但它不是真的可靠，有什么可以帮助我吗？

Answer 1

Dunno为什么你需要jQuery - 有一种更简单的方法可以使用angular但是你去了：angular有一个名为$$postDigest的私有方法，因为所有的DOM和模型更改都发生在$digest周期中它应该做你想做的，另一种方法是使用$timeout，我已经为你做了工作

http://plnkr.co/edit/oZ2xfoUQxcOzNw7eXCmT?p=preview

$scope.htmlvar = $sce.trustAsHtml('<strong>Test</strong>');

$timeout(function () {
  console.log('timeout', jQuery('strong').text())
}, 0, false) //false to not run another digest

$scope.$$postDigest(function () {
  console.log('postDigest', jQuery('strong').text())
})

等待$ scope真正应用html中的更改

1 个答案: