ng-include不在IE中工作

时间:2013-05-24 07:00:43

标签: angularjs

我使用AngularJS开发了一个网页,并在开发过程中使用Google Chrome进行了测试。 Everythinh在Chrome中运行良好,但现在我也在Internet Explorer 9中进行了测试,我遇到了一个大问题。我有一个ng-repeat,根据他们所属的类别显示不同html的人。为了能够显示每个人的不同布局,我使用以下代码:

HTML的代码

<ul class="listview image" >
    <ng:include src="getIncludeFile(profile)" data-ng-repeat="profile in profiles"></ng:include>
</ul>

的Javascript

$scope.getIncludeFile = function(profile) {
        switch (profile.Age) {
            case "Child":
                return 'Child.html'; break;
            case "Elder":
                return 'Elder.html'; break;
            default:
                return 'Adult.html';
        }
    }

我已经阅读了角度文档,我在主要html页面的顶部有以下内容:

<!DOCTYPE html>
<html xmlns:ng="http://angularjs.org" class="ng-app:app" id="ng-app" lang="en" ng-app="app" ng-controller="appController">

我放入模板的内容并不重要,它永远不会在IE中显示。 ng-includes的正确数量出现在DOM中,所以我不认为问题是ng-repeat。我没有在互联网上发现任何类似的问题所以我问你是否有人知道什么是错的?

3 个答案:

答案 0 :(得分:0)

尝试将其更改为:

<div ng-include="getIncludeFile(profile)" data-ng-repeat="profile in profiles"></div>

您正在尝试使用现代浏览器识别的标签,但IE9及以下版本不会,尤其是在标签名称中使用冒号。
如果你想玩它真的安全使用前面的data-前缀。您还可以在IE9及更低版本的条件HTML语句中使用HTML5 Shiv,以继续安全地播放它。

答案 1 :(得分:0)

以下是我解决问题的尝试。

可编辑版本.. http://plnkr.co/edit/4PmbuLYYFLNwi6mRFaRP

在窗口模式下打开它,然后在IE9中使用url进行测试运行。

希望这会有所帮助..

答案 2 :(得分:0)

对于IE8 + 将ng-include保存在单独的div中,如:

<ul class="listview image" >
    <div data-ng-repeat="profile in profiles">
        <ng:include src="getIncludeFile(profile)"></ng:include>
    </div>      
</ul>

你可以通过禁用$ sce来使它在IE7中工作,因为ngInclude使用$ sce。