0

出于某种原因，我无法在我的主页中使用 ng-include。现在我需要一个替代解决方案来替代 ng-include 作为我的产品环境（Microsoft Excel Online 没有初始化主页上的 ng-include）。

另外，我不想使用 ng-view，因为我必须坚持单一路线。

仅供参考，我的 ng-include url 将指向一个包含其自己的控制器及其范围变量的 html 模板。

主页.html

<body ng-app="myapp">
    <div class="container-main" ng-controller="MainCtrl">
     <div class="container-content">
        <div ng-include="content.url"> </div>
    </div>
</div>
</body>

控制器.js

angular.module('myapp').controller('MainCtrl', function ($scope) {
   $scope.content = { url : 'views/templates/mycontent.html'};
});

视图/模板/mycontent.html：

<div class="flat-footer" ng-controller="FooterCtrl">
    <div class="icon-home" ng-click="settings=false;help=false;gohome()">
    </div>

<div class="icon-question" ng-click="settings=false;help=!help;showHelpPreview()" ng-init="help=false">
     <div class="arrow-down" ng-show="help"/>
</div>
<div class="icon-cog" ng-init="settings=false" ng-click="settings=!settings;help=false" ng-show="isloggedIn">
        <div class="arrow-down" ng-show="settings" />
</div>
  <div class="settings-list" ng-show="settings">
            <div class="pull-right icon-cancel-circle" ng-click="settings=!settings;help=false"/>
            <button type="button" class="btn btn-primary logout" ng-click="settings=!settings;help=false;logout()">Logout</button>
  </div>
    <div class="help-option" ng-show="help">
        <div class="pull-right icon-cancel-circle" ng-click="help=!help;settings=false"/>
        <div>
            <h1 class="title">//showHelpForUsecase.name//</h1>
             <p class="title-description">//showHelpForUsecase.description// </p> 
            <dl> 
            <dt class="welcome-title">  //showHelpForUsecase.subtitle// </dt>
                <dd class="welcome-definition"> //showHelpForUsecase.subdescription//</dd>
            </dl>
        </div>
         <div class="footer-help-info">
                <p class="more-info"><a href="//moreInfoURL//" target="_blank">More Info</a></p>
        </div>
        <div class="help-buttons-group">
                <button type="button" class="btn btn-default help-go-back-btn" ng-click="help=!help;settings=false">Back</button>
        </div>
    </div>
</div>

我想删除主页中的 ng-include 并在加载时将 mycontent.html 加载到“div.container-content”元素中。

注意：使用 bind-html-unsafe 属性而不是 ng-include 不会编译 html 模板，而只是绑定 html 内容，并且生成的内部 html 内容根本不绑定到其控制器。

请帮我解决这个问题。

问候，拉姆

4

1 回答 1

1

bind-html-unsafe 属性是 ng-include 的可能解决方法。

主页.html

<body ng-app="myapp">
    <div class="container-main" ng-controller="MainCtrl">
     <div class="container-content">
        <div bind-html-unsafe="content"> </div>
    </div>
</div>
</body>

angular.module('myapp').controller('MainCtrl', function ($scope) {
   $scope.content = { url : 'views/templates/mycontent.html'};
   
  $http.get('views/templates/mycontent.html', {cache: $templateCache}).success(function(data) {
                    var newScope = $scope.$new();
                    $scope.content =  $compile(data)(newScope);
            });
  
});

于 2015-01-12T05:43:56.357 回答