AngularJS и Internet Explorer
У меня проблемы с загрузкой приложения в Internet Explorer 7 и 8 и даже 9.
Я получаю следующее сообщение об ошибке (консоль)
Uncaught TypeError: Cannot read property 'nodeName' of undefined
При загрузке переменные {{}} загружаются и исчезают. Ничего не было оказано.
Я добавил это в тег 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;">
Я добавил ieshiv.js из фреймворка AngularUI.
я добавил
<!--[if lt IE 8]>
<script src="files/js/json3.min.js"></script>
<![endif]-->
(Вопрос: достаточно ли этого, просто добавив в мой головной раздел или я тоже должен изменить свой код?)
Я также добавил это в мой головной раздел:
<!--[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]-->
И это не работает вообще. Переменные не загружены, список не отображается и веб-сайт не работает.
Chrome, FF и Opera работают нормально.
У вас есть какие-нибудь советы, с чего начать?
РЕДАКТИРОВАТЬ 1:
Ссылка на мой controller.js на paste.bin
http://pastebin.com/z67qE9ME
РЕДАКТИРОВАТЬ 2:
Это может быть порядок загрузки JS?
<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"></scri,pt>
<!--[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>
РЕДАКТИРОВАТЬ 3:
Хорошо, я добавил fauxconsole.js в мой скрипт и очистил код, и это сработало. Ну, по крайней мере, он загружается правильно (без какой-либо коррекции CSS). Но он не загружает встроенный стиль на некоторые из моих тегов. У тебя есть идея почему?
<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>
РЕДАКТИРОВАТЬ 4:
Редактировать 3 также решается с этой помощью здесь:
https://groups.google.com/d/msg/angular/0zHsVuUryKI/ckTvY93NcRsJ
Но у меня сейчас другая проблема. В IE 8 и ниже шаблон маршрута не отображается. Я просто вижу переменные {{}} и не более.
РЕДАКТИРОВАТЬ 5:
Это странно. Мне удалось загрузить первый шаблон правильно. Все скобки {{}} загружаются правильно.
Я добавил .resolve к моему 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;
}
};
Странная вещь Из (правильно обработанного) шаблона я связываюсь со вторым шаблоном и маршрутом (от дилера /: id до / dealermessage /: id), но ЭТОТ маршрут (и все то же самое, включая разрешение) не загружается должным образом, тот же ошибка, чем раньше, шаблон не отображается.
Маршруты:
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'
});
}]);
У кого-нибудь есть подсказка, в чем или где может быть ошибка?