我经常遇到一个问题,我无法使用通过 $http 检索的模板部分中包含的指令。我假设我需要对模板使用 $compile
或 $apply
才能使指令正常工作。以下代码尝试对 $http
返回的数据使用 $apply,但它不起作用:
$http({
url: 'get/data',
method: "POST"
})
.success(function (data, status, headers, config) {
$scope.$apply(function () {
$scope.data = data;
});
})
.error(function (data, status, headers, config) { $scope.status = status; });
返回值 (data
) 只是一个模板,其中包含一些 HTML,其中包含一些指令。如果我写
.success(function (data, status, headers, config) { $scope.data = data }
然后模板会加载,但模板中的任何指令都不起作用。所以我想我需要使用 $apply
或 $compile
将指令绑定(bind)到 Angular。显然,我在理解 Angular 以及如何将指令绑定(bind)到动态加载模板中工作时缺少一些基本知识。任何帮助将不胜感激。
最佳答案
您是正确的,您需要使用 $compile 服务来处理动态加载模板中的指令。 $compile 处理一些 html 并返回一个链接函数。当使用作用域调用链接函数时,它会返回带有功能指令的完全编译和链接的模板。然后必须将该模板插入到实时 DOM 中。正如 zsong 所指出的,这意味着所有这些实际上都应该在指令中完成,这是 Angular 中 DOM 操作的领域。一行:
container.html($compile(loadedHtml)(scope))
container 是 DOM 中将包含动态模板的元素。我们将其 html 设置为将编译的 html 链接到范围的结果。
关于angularjs - 如何编译 $http 请求返回的数据?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17958349/