AngularJS：动态加载从数据库中检索的 HTML 标记答案

【问题标题】：AngularJS: Dynamically load HTML tag retrieved from databaseAngularJS：动态加载从数据库中检索的 HTML 标记
【发布时间】：2015-01-23 04:57:21
【问题描述】：

我正在使用 factory 从 JSON 文件中获取数据：

appService.factory('svr', ['$resource', function($resource) {
    return $resource('data/:pageName.json', {}, {query:{method:'GET', isArray:true}});
}]);

并在controller 中访问它：

appController.controller('requirementCtrl', ['$scope', 'svr', function($scope, svr){
    $scope.ques = svr.query({pageName:'question'});
}]);

JSON 文件中的数据包含标签、四个选项和一个类型复选框（如值）。我必须使用此数据将其格式化为 HTML 标记。

我发现一种方法是在controller 中创建一个HTML 标记，并使用ng-bind-html 将其绑定到div。指令不起作用，因为我已经实现了ngRoute。

最好的方法是什么？

【问题讨论】：

可能你需要ng-include。
请展示您尝试过的解决方案并指出失败的地方。
为什么不直接在模板中静态设置 HTML，然后使用svr.query 的结果设置$scope vars 以便更新？您甚至可以使用$scope.ready = false 隐藏它（加载完成后设置为true）并在模板中使用ng-show？
我可以有很多复选框，所以我如何使用静态模板来处理可变数据
ng-repeat 并使用 $scope 变量来确定有多少。我假设您的意思是 JSON 是一个对象数组？

标签： json angularjs factory ngroute

【解决方案1】：

我认为解决方案是“编译”您的元素，例如：

$compile(element.contents())(scope);

http://onehungrymind.com/angularjs-dynamic-templates/

其他解决方案可能（由 Ben Nadel）：http://www.bennadel.com/blog/2449-directive-link-observe-and-watch-functions-execute-inside-an-angularjs-context.htm

【讨论】：