2013-10-09 3 views
6

Проблемы:

Я пытаюсь загрузить приложение Угловое JS в загрузочной области модальной, и отображается странное поведение на Internet Explorer (мы тестировали его на IE9 и 8).

мы обнаружили, что мы получали следующие ошибки: неопределенные ** объект Errorundefined

SCRIPT5022: 10 $digest() iterations reached. Aborting! 
Watchers fired in the last 5 iterations: [["fn: function $locationWatch() { 
    var oldUrl = $browser.url(); 
    var currentReplace = $location.$$replace; 

    if (!changeCounter || oldUrl != $location.absUrl()) { 
    changeCounter++; 
    $rootScope.$evalAsync(function() { 
     if ($rootScope.$broadcast('$locationChangeStart', $location.absUrl(), oldUrl). 
      defaultPrevented) { 
     $location.$$parse(oldUrl); 
     } else { 
     $browser.url($location.absUrl(), currentReplace); 
     afterLocationChange(oldUrl); 
     } 
    }); 
    } 
    $location.$$replace = false; 

    return changeCounter; 
}; newVal: 7; oldVal: 6"],["fn: function $locationWatch() { 
    var oldUrl = $browser.url(); 
    var currentReplace = $location.$$replace; 

    if (!changeCounter || oldUrl != $location.absUrl()) { 
    changeCounter++; 
    $rootScope.$evalAsync(function() { 
     if ($rootScope.$broadcast('$locationChangeStart', $location.absUrl(), oldUrl). 
      defaultPrevented) { 
     $location.$$parse(oldUrl); 
     } else { 
     $browser.url($location.absUrl(), currentReplace); 
     afterLocationChange(oldUrl); 
     } 
    }); 
    } 
    $location.$$replace = false; 

    return changeCounter; 
}; newVal: 8; oldVal: 7"],["fn: function $locationWatch() { 
    var oldUrl = $browser.url(); 
    var currentReplace = $location.$$replace; 

    if (!changeCounter || oldUrl != $location.absUrl()) { 
    changeCounter++; 
    $rootScope.$evalAsync(function() { 
     if ($rootScope.$broadcast('$locationChangeStart', $location.absUrl(), oldUrl). 
      defaultPrevented) { 
     $location.$$parse(oldUrl); 
     } else { 
     $browser.url($location.absUrl(), currentReplace); 
     afterLocationChange(oldUrl); 
     } 
    }); 
    } 
    $location.$$replace = false; 

    return changeCounter; 
}; newVal: 9; oldVal: 8"],["fn: function $locationWatch() { 
    var oldUrl = $browser.url(); 
    var currentReplace = $location.$$replace; 

    if (!changeCounter || oldUrl != $location.absUrl()) { 
    changeCounter++; 
    $rootScope.$evalAsync(function() { 
     if ($rootScope.$broadcast('$locationChangeStart', $location.absUrl(), oldUrl). 
      defaultPrevented) { 
     $location.$$parse(oldUrl); 
     } else { 
     $browser.url($location.absUrl(), currentReplace); 
     afterLocationChange(oldUrl); 
     } 
    }); 
    } 
    $location.$$replace = false; 

    return changeCounter; 
}; newVal: 10; oldVal: 9"],["fn: function $locationWatch() { 
    var oldUrl = $browser.url(); 
    var currentReplace = $location.$$replace; 

    if (!changeCounter || oldUrl != $location.absUrl()) { 
    changeCounter++; 
    $rootScope.$evalAsync(function() { 
     if ($rootScope.$broadcast('$locationChangeStart', $location.absUrl(), oldUrl). 
      defaultPrevented) { 
     $location.$$parse(oldUrl); 
     } else { 
     $browser.url($location.absUrl(), currentReplace); 
     afterLocationChange(oldUrl); 
     } 
    }); 
    } 
    $location.$$replace = false; 

    return changeCounter; 
}; newVal: 11; oldVal: 10"]] 

и многие другие ошибки

** 'JSON'

Итак, мы обнаружили, что есть 3 на IE: 1) JSON не был доступен 2) Проблема с приложением Bootstraping 3) Просмотр проблемы рендеринга

после прохождения через Угловое JS документации и множеством нитей из StackOverflow, таких как:

Мы обнаружили, что есть несколько общих для всех потоков (также упомянутых в AngulaJS IE руководства): * Включать JSON2/JSON3 pollyfills для IE * использовать IE-заточку, и заранее объявить пользовательские теги (мы используем пользовательские машинописная директива, с ограничением: «E», заменить: правда) * использовать другие IE конкретные инструкции

Итак, я сделал следующую chagnes:

var markup = '<div id="ng-app" class="ng-app:myapp" ng-app="myapp" xmlns:ng="http://angularjs.org"><div ng-controller="MyAppAppCtrl"><div ng-view></div></div></div>'; 
    jQuery('#works-modal').html(markup); 
    angular.bootstrap(jQuery('#ng-app'), ['myapp']); 
    jQuery('#works-modal').modal('show'); 

После реализации вышеуказанных изменений, я все еще получаю:

Error: 10 $digest() iterations reached. Aborting! 

https://github.com/angular/angular.js/issues/1417

При попытке вынести вид, и приложение было перенаправление на главную страницу. поэтому я попытался внести изменения, предложенные в:

https://github.com/RobbinHabermehl/angular.js/commit/c801f91a25b9be6f5b1163c012e63c84cc6a1359

Теперь я больше не получаю ошибку, когда я нажимаю на ссылку, чтобы отобразить диалоговое окно модальным, он отображает всплывающие на секунду, затем переадресовывает на главную страницу.

Если я устанавливаю:

$locationProvider.html5Mode(false) 
    .hashPrefix('!'); 

Он отлично работает. Кто-нибудь сталкивается с подобной проблемой? Любая помощь приветствуется.

Update Я также сообщил, этот вопрос в списке ошибок Угловой JS Github, они сообщили мне, что они зафиксировали этот вопрос в версии 1.2:

https://github.com/angular/angular.js/issues/3397

Я буду проверять и обновлять этот поток, если это решает мою проблему.

Update

Я обновил мою версию Угловое, и это, кажется, решить эту "10 $ дайджеста() итераций достигнуто. Aborting!", однако, по-прежнему, как представляется, вызывая изменение URL, что приводит к перенаправлению на домашнюю страницу.

Позвольте мне объяснить мой сценарий здесь, так что другие могут предложить мне, если это точно связано с этим или нет:

У меня есть страница сказать: http://example.com/users/myCollection.html На этой странице, я загрузке мое приложение AngularJS внутри диалогового окна Bootstrap Modal, когда пользователь нажимает на какую-либо ссылку на странице. Угловой путь приложения, загруженное в модальном: /MyWork/найти

После повысит версию Угловых, теперь, режимный, кажется, загрузку приложения на секунду, а затем, перенаправление происходит, и он идет на главную страницу.

FYI, я также использую jQuery на странице, которая используется для запуска приложения Angular, есть ли вероятность конфликта из-за этого?

Спасибо, Равиш

+0

«JSON не определен» означает, что в IE8 +, что страница работает в режиме совместимости. В стандартном режиме доступен доступ к глобальному «JSON». Проблемы с рендерингом и другие вещи также могут быть вызваны неправильным режимом рендеринга. – Tomalak

+0

ну, я дошел до проблемы с JSON undefined. из-за некоторых причин совместимости мы используем «EmulateIE7» – Ravish

+0

Я использую 'Hogan Engine', если это помогает. Я установил 'html5mode (false)' и, и добавил некоторый * console.log *, чтобы увидеть, был ли мой контроллер фактически вызван несколько раз, ну, он был вызван дважды, но просмотр был визуализирован, когда 'html5mode (false)' – Ravish

ответ

9

Я уже summerize свои проблемы выше, и шаги, которые я взял, чтобы исправить эти проблемы, позвольте мне summerize снова, то я summerize вопрос с "10 $ дайджеста() итераций . достигло Прерывание «:

Шаг 1) Проблема с применением самонастройки на IE

Проблема с применением самонастройки на IE. Мы загружаем наше угловое приложение внутри модального диалога Bootstrap и вручную загружаем приложение Angular. Поскольку мы получали представление об ошибке, мы подозревали, что он был выпущен либо: мы пропустили что-то, что наш любимый IE не нравится, или ему просто не нравится моя настраиваемая директива, или Hogan Engine, которые мы использовали с нашим обычным директивы. Я разрешил их, прочитав конкретную документацию Angular JS и один поток Stackoverflow.

я настоятельно рекомендую следующие всех, работать, или буду работать на угловой JS, что вы предполагаете использовать в IE, пожалуйста, прочтите следующее:

Стадия 2)

После шага 1 мы смогли получить приложение, работающее с html5mode (false), но html5mode (true) все еще было проблемой для нас. После некоторой отладки и добавления пары console.log мы поняли, что даже с html5mode (false) приложение было загружено дважды. Дважды ?, но мы были вручную загрузочным приложением. Ниже мой шаблон для самонастройки углового приложения:

var markup = '<div id="ng-app" class="ng-app:myapp" ng-app="myapp" xmlns:ng="http://angularjs.org"><div ng-controller="MyAppAppCtrl"><div ng-view></div></div></div>'; 
jQuery('#works-modal').html(markup); 
angular.bootstrap(jQuery('#ng-app'), ['myapp']); 
jQuery('#works-modal').modal('show'); 

Мы модифицировали выше шаблон что-то вроде:

var markup = '<div id="ng-app" ng-app="myapp" xmlns:ng="http://angularjs.org"><div ng-controller="MyAppAppCtrl"><div ng-view></div></div></div>'; 
jQuery('#works-modal').html(markup); 
angular.bootstrap(jQuery('#ng-app'), ['myapp']); 
jQuery('#works-modal').modal('show'); 

добавил OnClick = "возвращение ложной;" href = "#" в ссылке, используемой для запуска приложения.

Примечание: Если есть гиперссылок в вашем приложении, убедитесь, что вы с ними должным образом, и они делают то, что вы хотите их сделать, потому что, «HREF», может привести к изменению местоположения, что ваше приложение не может как.

Шаг 3) Обновленная версия Угловой JS

Существовало несколько возможного исправление упомянутых в некоторых страницах ошибок Угловой JS Github:

одно такое исправление упоминалось в следующем Gist: https://github.com/RobbinHabermehl/angular.js/commit/c801f91a25b9be6f5b1163c012e63c84cc6a1359

Тем не менее, мне было неловко понимать, что исправление основных библиотек, обновление основных библиотек имеет свой собственный недостаток, то есть вы можете перераспределить часть кода, используемого вашим приложением из библиотеки, устарели, но если есть критические исправления ошибок (например, исправление проблемы, с которой мы столкнулись) и улучшение, это всегда выход. поэтому мы перейдем к последней стабильной конструкции Angular JS.

Теперь мы больше не получаем ошибку и можем загружать наше приложение во все браузеры (да, даже на OMG IE7;)).

Все хорошо, правда? Ну, после обновления версии Angular, теперь, Modal, похоже, загружает приложение на секунду, а затем перенаправление происходит, и оно переходит на домашнюю страницу.

Однако, объясняет Угловая JS $ услуги гида место ($ конфигурации службы местоположение и Hashbang и HTML5 режимы), это здесь: http://code.angularjs.org/1.2.14/docs/guide/dev_guide.services.$location

HashBang (или HTML5 режим запасной вариант) требует настройки на стороне сервера, который является своего рода серверная «взломать».И это действительно зависит от вас, если вы действительно хотите чего-то подобного или нет.

Итак, все хорошо сейчас :)

Надеется, что это будет какой-то польза, кто борется с этим или somethign похожи.

Снова Угловое JS скалы;)

+1

Это примерный ответ на вопрос, ответ на который я сам ответил. Продолжайте, потому что большинство людей не беспокоится, объясняя свои собственные решения. +1 – Tomalak

Смежные вопросы