angularjs - 通过 ng-include 渲染字符串模板

Question

我正在尝试渲染一段 html，在动态路由上可用，该路由是通过 $http.get() 获取的调用，它返回一段html，

举个例子，我尝试加载这个 html 部分:

<h1>{{ pagetitle }}</h1>
this is a simple page example

我做了一个小 fiddle 来模拟这个问题，但为了简单起见，我留下了 http 调用，只是在范围内的字符串中添加了 html。

Controller 是:

function Ctrl($scope) {
    $scope.data = {
        view: "<h1>whaaaaa</h1>"        
    }; 
}

页面html是这样的:

<div ng-app="">
  <div ng-controller="Ctrl">
    <div ng-include src="data.view"></div>
  </div>
</div>

问题是它没有将字符串添加到 html 文件(ng-include)中，但它对由该字符串组成的 url 进行了 http 调用。

那么是否不可能只将字符串输入到包含中？如果不是，那么对动态 url 进行 http 调用并将返回的 url 输入页面的正确方法是什么。

您可以在 JSFiddle 中玩它.

Answer 1

您可以使用 ng-bind-html-unsafe
如果您不信任来自 ajax 请求的 html，也可以使用 ng-bind-html 这需要 $sanitize 上类服务 (DEMO)。

<div ng-bind-html="data.view"></div>

要使用它，您需要包含 an extra js file .

angular.module('app', ['ngSanitize']);

当然，将应用程序添加到 ng-app:

<div ng-app="app">