Javascript 如何获取使用Angular js绑定的div的内容？

我想获取包含角度范围绑定数据的div的内容

<div id='someDiv'> <h1> {{someText}} </h1> </div>

innerHtml属性不起作用。document.getElementById（'someDiv'）。innerHtml不起作用，因为它返回未绑定的变量

var content=document.getElementById（'someDiv'）.innerHtml； 控制台日志（内容）

日志记录的结果

{{someText}

我希望它在变量绑定到它的值之后返回div内容，就像“Hello World！”

---

如何实现这一点？

您需要在angular中使用$timeout服务。可能需要创建一个指令来提取HTML，因为没有确定的方法来知道当在angular之外时什么时候完成摘要循环

以下是此类指令的一个示例：

module.directive('getRenderedHtml', function($timeout) {
    return {
        controller: function ($scope) {
            return {};
        },
        requires: 'getRenderedHtml',
        link: function(scope, element, attrs, thisController) {
            var rawHtmlContainer = angular.element('<div></div>');
            $timeout(function() {
                thisController.html = element[0].innerHTML;
            });
        }
    }
});

module.directive（'getRenderedHtml'，函数（$timeout）{
返回{
控制器：功能（$scope）{
返回{}；
},
需要：“getRenderedHtml”，
链接：函数（范围、元素、属性、thisController）{
var rawHtmlContainer=angular.element（“”）；
$timeout（函数（）{
thisController.html=元素[0]。innerHTML；
});
}
}
});

---

在angular有机会处理之前，您可能试图过早获取该值

innerHtml

应为

innerHtml

，并尝试在超时时将其包装<代码>设置超时（函数（）{console.log（document.getElementById（'someDiv'）.innerHtml）；}）您可能需要等待angular的摘要循环完成。仅在setTimeout（）上执行此操作可能不够。@PSL，谢谢，您的注释和提琴说明了根本问题。谢谢，指令示例很棒。如何修改指令以通过控制器内的变量访问呈现的html？答案取决于您计划在何处/如何使用html。将数据存储在控制器中似乎不正确。如果您需要应用程序中多个不同位置的数据，那么将数据存储在服务中会更有意义。或者，您可以将数据存储在指令的控制器中，尽管只有子指令可以使用它，但它也可以直接在HTML中使用。

module.directive('getRenderedHtml', function($timeout) {
    return {
        controller: function ($scope) {
            return {};
        },
        requires: 'getRenderedHtml',
        link: function(scope, element, attrs, thisController) {
            var rawHtmlContainer = angular.element('<div></div>');
            $timeout(function() {
                thisController.html = element[0].innerHTML;
            });
        }
    }
});