AngularJS et Internet Explorer

J'ai des problèmes pour l'obtention de mon app de chargement sur Internet Explorer 7 & 8 et même 9.

J'obtiens le message d'erreur suivant (console) 

Uncaught TypeError: Cannot read property 'nodeName' of undefined

Sur charger le {{}} les variables sont de chargement et de disparaître. Rien n'a été rendue.

J'ai ajouté ceci à la balise html: 

<html xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="http://www.facebook.com/2008/fbml" xmlns:ng="http://angularjs.org" id="ng-app" class="ng-app: myapp;">

J'ai ajouté ieshiv.js à partir de la AngularUI cadre.

J'ai ajouté 

<!--[if lt IE 8]>
     <script src="files/js/json3.min.js"></script>
<![endif]-->

(Question: est-ce assez, juste en ajoutant à mon chef de section ou dois-je modifier mon code aussi?)

J'ai aussi ajouté ça à mon chef de section: 

<!--[if lte IE 8]>
      <script>
        document.createElement('ng-include');
        document.createElement('ng-pluralize');
        document.createElement('ng-view');
        document.createElement('slide');
        document.createElement('carousel');

        //Optionally these for CSS
        document.createElement('ng:include');
        document.createElement('ng:pluralize');
        document.createElement('ng:view');
      </script>
    <![endif]-->

Et il ne fonctionne pas du tout. Pas de variables sont chargés, pas de liste est rendu et le site web ne fonctionne pas.

Chrome, FF et Opera fonctionnent très bien.

Avez-vous des conseils par où commencer ?

EDIT 1:

Lien vers mon controller.js sur la pâte.bin

http://pastebin.com/z67qE9ME

EDIT 2:

C'est peut-être à l'ordre de la js chargement? 

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/jquery-ui.min.js"></script>
<!--[if lt IE 8]>
     <script src="files/js/json3.min.js"></script>
<![endif]-->
<script src="files/js/angular.min.js"></script>
<script src="files/js/ui-bootstrap-tpls-0.1.0-SNAPSHOT.js"></script>
<script src="files/js/angular-ui.js"></script>
<script src="files/js/angular-resource.min.js"></script>
<script src="files/js/controller.js"></script>
<script src="files/js/select2.js"></script>
<script src="files/js/main.js"></script>

EDIT 3:

Ok, j'ai ajouté fauxconsole.js à mon script et nettoyé le code et ça a fonctionné. Eh bien, au moins il se charge correctement (sans css correction). Mais il ne charge pas de style en ligne sur certains de mes balises. Avez-vous une idée de pourquoi? 

<a ng-click="details.show=toggle(marker)" ng-class="{active_marker: active_marker.show == marker.id}" href="#/dealer/{{marker.id}}" class="marker" style="left:{{marker.coordleft}}px;top:{{marker.coordtop}}px">
</a></div>

EDIT 4:

Edit 3 est également résolu avec cette aide ici:

https://groups.google.com/d/msg/angular/0zHsVuUryKI/ckTvY93NcRsJ

Mais j'ai maintenant un autre problème. Dans IE 8 et en dessous de la route de modèle ne sont pas rendu. Je viens de voir les {{}} variables, et pas plus.

EDIT 5:

Ce qui est étrange. J'ai réussi à charger le premier modèle droit. Tous les crochets {{}} se chargent correctement.

Ai-je ajouté .résoudre à mon Ctrl: 

//DealerDetailsCtrl
function DealerDetailsCtrl($scope, $rootScope, $routeParams, dealerService, datasets) {
    $scope.loading = true;
    //Abfrage
    $rootScope.dealerdetails = datasets;
    //inline styles fuer positionierung laden
    $rootScope.itemStyle2 = function (item) {
        return { left: item.divleft * 1 + 390 + 'px', top: item.divtop * 1 + 160 + 'px'};
    };
    //Feedback zur Message zurruecksetzen
    $scope.issend = $rootScope.issend;
    $rootScope.issend = false;
    $scope.loading = false;
    //Close Button
    $rootScope.close = function() {
        $rootScope.marker = null;
        $rootScope.details = {show: false};
        $rootScope.alldealer = {show: false};
        $rootScope.active_marker = null;
    };
    $rootScope.$on("$routeChangeStart", function (event, next, current) {
        $scope.loading = true;
    });

}
DealerDetailsCtrl.resolve = {
    datasets : function($q, $http, $route, $rootScope) {
        var deferred = $q.defer();

        $http.get('files/framework/dealer/'+ $route.current.params.id +'/' + $rootScope.token).success(function(data) {
            deferred.resolve(data);
        });

        return deferred.promise;
    }
};

La chose étrange est. À partir de l' (correctement rendu) modèle, j'ai un lien à un deuxième modèle et de la route (à partir de marchand/:id /dealermessage/:id), mais CETTE route (et tout ce qui est la même, y compris le résoudre) n'est pas chargé correctement, même erreur qu'avant, le modèle n'est pas rendu.

Routes: 

app.config(['$routeProvider', function($routeProvider) {
    $routeProvider.
    when('/dealer/:id', {
        templateUrl: 'files/tpl/dealer-details.html?333',
        controller: 'DealerDetailsCtrl',
        activetab: 'details',
        resolve: DealerDetailsCtrl.resolve
    }).
    when('/dealermessage/:id', {
        templateUrl: 'files/tpl/dealer-message.html?222',
        controller: 'DealerMessageCtrl',
        activetab: 'message',
        resolve: DealerMessageCtrl.resolve
    }).
    when('/dealersendmessage/:id', {
        templateUrl: 'files/tpl/dealer-details.html?444',
        controller: 'DealerDetailsCtrl',
        activetab: 'details',
        resolve: DealerDetailsCtrl.resolve
    }).
    otherwise({
        redirectTo: '/dealer'
    });
}]);

Quelqu'un a une idée, quoi, ni où l'erreur peut-être?

L'affichage du code dans un jsfiddle serait une excellente façon de commencer.
Cela peut être un problème parce que c'est un projet du client divisé en un grand nombre de fichiers, mais je vais poster mes controller.js et le principal modèle html. Juste un moment.
<!doctype html> ?
Oui, il est disponible.
Puis-je vous recommandons d'affiner cette question vers le bas (ou en créer un nouveau?) avec le courant de problèmes restants?

OriginalL'auteur Marek123 | 2013-01-22

  1. 2

    Le projet Angular-UI contient un "sous-projet" nommé "IEShiv" qui devrait vous permettre d'exécuter angulaire en douceur sous IE : https://github.com/angular-ui/angular-ui/tree/master/common/ieshiv

    Comme dit il, vous avez seulement besoin de ceci :

    <!--[if lte IE 8]> <script src="build/angular-ui-ieshiv.js"></script><![endif]-->

    OriginalL'auteur Ven

  2. 0

    Chaque fois que j'ai eu ce type d'erreurs dans IE (spécialement 8) C'était soit l'un de ces 2 questions.

    1) j'ai été en utilisant un tag personnalisé comme <auto-complete> et n'a pas été à l'aide de document.createElement

    2) j'ai eu des éléments avec des doublons de id attributs. IE n'aime pas cela.

    Méthode d'élimination normalement fonctionne pour moi d'isoler le problème dans le modèle.

    OriginalL'auteur Ketan