Angulaire ne fonctionne pas sous IE 8, ne peut pas créer un élément personnalisé pour mes directives

J'ai construit mon application à partir de zéro depuis quelques semaines.
Je l'ai fait tout en mettant en œuvre les instructions ici.

Je dois dire que tout fonctionne très bien avec n'importe quel navigateur comme Mozilla ou Chrome, et le Angular.js le cadre a été d'une grande aide pour moi.

Le problème, c'est qu'avec IE8, tout semble être rompu, et le document.createElement
DOM objet déclenche une errro lorsque j'essaie de créer un élément de mon custome directive(dont je suis également à l'aide d'un 'x' préfixe, comme requis par cette excuse boiteuse d'un btowser).

Une capture d'écran:
Angulaire ne fonctionne pas sous IE 8, ne peut pas créer un élément personnalisé pour mes directives

application de l'indice:

<!DOCTYPE html>
<html xmlns:ng="http://angularjs.org" xmlns:x-restrict="" xmlns:x-fileupload="" class="ng-app" ng-app="myApp" ng-controller="homeCtrl">
<link rel="stylesheet" type="text/css" href="css/foundation.css">
<link rel="stylesheet" type="text/css" href="css/form.css">
<link rel="stylesheet" type="text/css" href="css/meta.css">
<!--[if lte IE 8]>
<script src="js/json3.min.js"></script>
<script>
document.createElement('ng-include');
document.createElement('ng-pluralize');
document.createElement('ng-view');
document.createElement('x-restrict');
document.createElement('x-fileupload');
//Optionally these for CSS
document.createElement('ng:include');
document.createElement('ng:pluralize');
document.createElement('ng:view');
</script>
<![endif]-->
<title>{{model.title}}</title>
</head>
<body>
<div class="errorBar" ng-show="model.error.visible"><div class="errorBarContent">{{model.error.message}}</div></div>
<div ng-include src="layout.menuSrc"></div>
<div class="colmask threecol">
<div class="colmid">
<div class="colleft">
<div class="col1">
<ng-view></ng-view>
</div>
<div class="col2">
<div ng-include src="layout.leftSideBarSrc"></div>
</div>
<div class="col3">
<div ng-include src="layout.rightSideBarSrc"></div>
</div>
</div>
</div>
</div> 
<!--<div id="mainFrame">
</div> -->
<div ng-include src="layout.footerSrc" id="footer"></div>
</div>
<!-- TODO: REMOVE THE CDN JQUERY AND REPLACE IT WITH ONE THAT IS LOCATED WITHIN THE PROJECT -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="lib/angular/angular.js"></script>
<script src="lib/angular/angular-resource.js"></script>
<script src="js/app.js"></script>
<script src="js/services.js"></script>
<script src="js/controllers.js"></script>
<script src="js/filters.js"></script>
<script src="js/directives.js"></script>
<script src="lib/bluimp/js/vendor/jquery.ui.widget.js"></script>
<script src="lib/bluimp/js/jquery.iframe-transport.js"></script>
<script src="lib/bluimp/js/jquery.fileupload.js"></script>
</script>
</body>
</html>

Directive:

angular.module('myApp.directives', []).
directive('x-restrict', function(authService){
return{
restrict: 'A',
prioriry: 100000,
scope: false,
link: function(){
//alert('ergo sum!');
},
compile:  function(element, attr, linker){
var accessDenied = true;
var user = authService.getUser();
var attributes = attr.access.split(" ");
for(var i in attributes){
if(user.role == attributes[i]){
accessDenied = false;
}
}
if(accessDenied){
element.children().remove();
element.remove();           
}
}
}
});

OriginalL'auteur Oleg Belousov | 2013-09-03

  1. 8

    Vous devriez lire ce article sur l'utilisation Angulaire avec IE8 et plus tôt. Il y a quelques trucs que vous devez savoir sur. Chaque fois que je cible IE8 Angulaire, j'ai éviter d'écrire élément directives et le bâton avec attribut des directives à la place.

    Merci pour votre temps Brian. Je crois que j'ai fourni le même très lien dans ma question. Aussi tous mes directive sont de type limiter: 'A', comme vous pouvez le voir dans le code que j'ai posté. Ne fonctionne toujours pas. Merci encore
    Désolé à ce sujet. J'ai manqué. Une des choses qu'il souligne, c'est que vous devez définir ng-app comme un id: id="ng-app" (en plus de l'attribut par le nom du module). Ce qui manque à ton exemple.
    c'est ma compréhension que vous pouvez également utiliser: class="ng-app", mais je vais certainement essayer et vous tenir au courant
    le chargement de la page, sans erreurs, mais la directive ne semble pas encore au travail, peut-être que l'explorateur ne les gère pas. peut-être $de la compilation ne fonctionne pas bien avec IE8
    Pouvez-vous venir avec un jsFiddle qui démontre votre problème? Je suis ciblage IE8 dans un complexe Angulaire site sans problème. Si je ne suis heurté à des problèmes, il a tendance à être quelque chose qui doit être polyfilled. J'avais fossé de la document.createElement code complètement et mettez le tout dans les attributs (y compris ng-view).

    OriginalL'auteur Brian Genisio