AngularJS将HTML传递给作用域

Question

我要html去的地方：

<div>{{display}}</div>

app.js

var app = angular.module('app', []);
app.controller('ctrl', function ($scope) {
     $scope.contact = //get the html from contact.html
     $scope.display = $scope.contact
});

contact.html

<form>
  ...
</form>

如何将html传递给js文件？

更新：我不能使用ng-include，因为这是一个SPA，因此contact.html将运行的区域不是静态的。

Answer 1

您需要使用$sce服务和ng-sanitize 。 获得要包含在控制器/指令中的HTML后，请使用：

$sce.trustAsHtml($scope.htmlItem);

在您看来：

<div ng-bind-html="htmlItem"></div>

HTML将呈现在页面上。

Answer 2

或者，您可以ng-include。

    <!-- HEADER -->
    <div ng-include="'partials/header.html'"> </div>

    <!-- MAIN VIEW -->
    <div animated-view></div> //This is using ngRoute to populate content.

    <!-- FOOTER -->
    <div ng-include="'partials/footer.html'"> </div>

请记住使用嵌套的“”让Angular理解。

您还应该看看$ RouteProvider 。

这是我的一个示例 ，展示了如何使用RouteProvider填充ng-view。 您可以在routeProvider上设置视图，控制器和初始变量。