2014-09-12 2 views
3

Je présente angularjs dans un projet asp.net existant et il y a beaucoup d'instructions dans le projet qui fonctionnera seulement dans le mode de compatibilité IE 7, mais quand je exécuter le projet que je obtiens l'erreur suivante à partir AngularJS fichierErreur Angularjs dans IE 7 L'objet ne supporte pas la propriété ou la méthode 'querySelector'

Object doesn't support property or method 'querySelector' 

après un petit R & D sur la question, je me suis querySelector a été introduit seulement de IE 8.

maintenant, comment puis-je faire mon travail d'application dans IE 7 avec angularjs.?

Je ne veux pas mettre la méta-étiquette pour plus de IE 7 comme mon application existante dépend de IE 7 qui ne fonctionnera pas dans 8 et plus.

j'ai essayé de configurer le module angulaire désactivation SCE comme suit:

var rtApp = angular.module("realTimeNotifications", []).config(function($sceProvider) { 
    // Completely disable SCE to support IE7. 
    $sceProvider.enabled(false); 
}); 

mais toujours pas de chance.

Merci d'avance.

+0

See acceptés réponse: [** Exécution AngularJS App sur Internet Explorer 7 **] (http://stackoverflow.com/questions/15914675/running-angularjs-app-on-internet -explorer-7) - il mentionne le bootstrapping, mais en général, comme vous l'avez déjà dit, [** querySelector **] (https://developer.mozilla.org/en-US/docs/Web/API/document .querySelector) n'est pas supporté, vous pouvez également redimensionner la version d'AngularJs à un "plus" compatible avec IE7. - En outre, voir [** Traitant de la famille IE **] (http://ng-learn.org/2013/12/Dealing-with-IE-family/), en particulier la section sur le soutien IE 7. – Nope

+0

j'ai essayé ce bootstrapping, mais pas de chance comme le problème est avec l'objet querySelector –

+0

J'ai lié un autre article dans le commentaire qui se concentre sur traiter spécifiquement avec IE et il a une section entière en bas, en mentionnant shivs, polly-remplit et ainsi de suite. J'espère que cela aidera en quelque sorte. – Nope

Répondre

0

J'ai également été aux prises avec la compatibilité IE7 et IE6, et j'ai découvert que l'utilisation de la version 1.1.5 d'angularjs au lieu de 1.2.25 empêche l'erreur que vous décrivez. Que l'angle soit utilisable dans IE6 et IE7 au-delà de cet exemple simple est une autre question.

Le code ci-dessous a été testé dans IE6,7,8,9,11 sur un domaine avec le mode de compatibilité défini sur ON.

Je suppose que de nombreuses parties de l'exemple peuvent être omises. Je commence juste avec angulaire, donc je ne peux pas garantir que les meilleures pratiques sont utilisées. Cela devrait au moins fournir un point de départ.

<!DOCTYPE html> 
<html class="ng-app:phonecatApp" ng-app="phonecatApp" id="ng-app" xmlns:ng="http://angularjs.org" lang="en"> 
<head> 
    <meta http-equiv="X-UA-Compatible" content="IE=EDGE; IE=9; IE=8; IE=7" /> 
    <meta charset="utf-8"> 
    <title>My HTML File</title> 
    <link rel="stylesheet" href="../stylesheets/html5.css"> 
    <!--[if lte IE 7]> 
     <script src="../Includes/Client/JS/json2.js"></script> 
    <![endif]--> 

    <!--[if lte IE 9]> 
     <script type="text/javascript" src="es5-shim-4.0.3-min.js"></script> 
    <![endif]--> 
    <script type="text/javascript" src="html5shiv.min.js"></script> 
    <script type="text/javascript" src="angular-1.1.x.js"></script> 

    <script type="text/javascript"> 
     var phonecatApp = angular.module('phonecatApp', []); 

     phonecatApp.controller('PhoneListCtrl', function ($scope) { 
      $scope.phones = [ 
      {'name': 'Nexus S', 
      'snippet': 'Fast just got faster with Nexus S.'}, 
      {'name': 'Motorola XOOM™ with Wi-Fi', 
      'snippet': 'The Next, Next Generation tablet.'}, 
      {'name': 'MOTOROLA XOOM™', 
      'snippet': 'The Next, Next Generation tablet.'} 
      ]; 
     }); 
    </script> 
</head> 
<body ng-controller="PhoneListCtrl"> 

    <ul> 
     <li ng-repeat="phone in phones"> 
      {{phone.name}} 
      <p>{{phone.snippet}}</p> 
     </li> 
    </ul> 

</body> 

Questions connexes