如何在变量中编译ng-include html文件

Question

我将html字符串存储在范围对象中并希望将其传递给变量

  $scope.template1 = "div ng-include="'/app.html'" </div>" 

然后我想将此template1传递给我的bootstrap模板选项，其输出为$ scope.template1

 tour.start{
  template:$scope.template1// Here i'm looking the output with the content of app.html
  }

如何编译template1并传递输出？

Answer 1

只需使用$compile服务：

$scope.template1 = $compile("div ng-include="'/app.html'" </div>")($scope);

这样，您的模板将包含您的ng-include内容 （记得在你的依赖项中添加$ compile。）

顺便说一句，我建议您使用$ templateCache服务将您的静态内容存储在javascript中，以便拥有一个独特的位置（并进行优化！）来存储您的模板：

app.run(function($templateCache) {
  $templateCache.put('app.html', '<span> app.html content </span>');
});

您的ng-include会自动找到您的app.html模板。 您也应该为template1变量执行此操作，并使用以下命令在JS中检索它：

$templateCache.get('template1.html')