Сервис Toastr не работает для Inte rnet Explorer - PullRequest
Новая
       20

Сервис Toastr не работает для Inte rnet Explorer

0 голосов
/ 09 января 2020

Я использовал модуль ngx-toastr, чтобы показать toastr в моем приложении angular. Оно отлично работает с Chorme, Firefox, но не работает в IE ie, оно работает в функции ngOninit (), но не в любая другая функция. import {ToastrModule} из 'ngx-toastr';

Ответы [ 2 ]

1 голос
/ 28 января 2020

В моем случае контейнер с тостами показывался в DOM, но сам тост не отображался. (Вы можете проверить, является ли это ваш случай, проверяя DOM и ища текст «toast-container», который есть в контейнере div).

Я пытался раскомментировать строки polyfills и все, пока не понял, что тост установить свойство "display: none" по какой-то причине с помощью IE.

. Для меня работало только добавление этого в мои стили.s css: 

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  /* IE10+ CSS styles go here */

    .toast {
      display: block !important;
    }
}

@supports (-ms-accelerator:true) {


/* IE Edge 12+ CSS styles go here */ 

  .toast {
    display: block !important;
  }
}

Надеюсь, это поможет!

0 голосов
/ 09 января 2020

polyfills.ts

/ **

  • Этот файл содержит полифилы, необходимые для Angular, и загружается перед приложением.

  • Вы можете добавить в этот файл свои собственные дополнительные заливки.

    *

  • Этот файл состоит из 2 разделов:

    1. Браузерные полифилы. Они применяются перед загрузкой зоны JS и сортируются браузерами.
  • Импорт приложений. Файлы, импортированные после Zone JS, которые должны быть загружены перед вашим основным

  • .

    *

  • Текущая настройка для так называемых «вечнозеленых» браузеров; последние версии браузеров, которые

  • автоматически обновляются. Это включает в себя Safari> = 10, Chrome> = 55 (включая Opera),

  • Edge> = 13 на рабочем столе и iOS 10 и Chrome на мобильном телефоне.

    *

  • Подробнее о https://angular.io/docs/ts/latest/guide/browser-support.html

    * /

/ ************************************************ ************************************************** *

  • БРАУЗЕРНЫЕ ПОЛИФИЛЛЫ

    * /

/ ** Для IE9, IE10 и IE11 требуются все следующие полизаполнения. ** /

import 'core-js / es6 / symbol';

import 'core-js / es6 / object';

import 'core-js / es6 / function ';

import' core-js / es6 / parse-int ';

import' core-js / es6 / parse-float ';

import' core-js / es6 / number ';

import' core-js / es6 / math ';

import' core-js / es6 / string ';

import 'core-js / es6 / date';

импорт 'core-js / es6 / array';

import 'core-js / es6 / regexp';

import 'core-js / es6 / map';

import 'core-js / es6 / weak-map';

import 'core-js / es6 / set';

/ ** Для IE10 и IE11 требуется следующее для поддержки NgClass для элементов SVG * /

import 'classlist. js'; // Запуск npm install --save classlist.js.

/ ** Для IE10 и IE11 требуется следующее для API Reflect. * /

import 'core-js / es6 / refle';

/ ** Evergreen браузеры требуют этого. ** /

// Используется для отражения метаданных в JIT. Если вы используете AOT (и только Angular декораторы), вы можете удалить.

import 'core-js / es7 / refle';

/ **

  • Веб-анимация @angular/platform-browser/animations

  • Требуется только в том случае, если в приложении используется AnimationBuilder и используется IE / Edge или Safari.

  • Стандартная поддержка анимации в Angular НЕ ТРЕБУЕТ никаких поли-заливок (начиная с Angular 6.0).

    ** /

import 'web-animations- js '; // Выполнить npm install --save web-animations-js.

/ **

  • По умолчанию зона. js исправит все возможные macroTask и DomEvents

  • пользователь может отключить части патча macroTask / DomEvents, установив следующие флаги

    * /

(окно как любое) .__ Zone_disable_requestAnimationFrame = true; // отключаем патч requestAnimationFrame

(окно как любое) .__ Zone_disable_on_property = true; // отключаем патч для свойства, например onclick

(окно как любое) .__ zone_symbol__BLACK_LISTED_EVENTS = ['scroll', 'mousemove']; // отключить исправление указанного событияNames

/ *

  • в инструментах разработчика IE / Edge, addEventListener также будет заключен в зону. js

  • со следующим флагом, он пропустит zone.js патч для IE / Edge

    * /

(окно как любое) .__ Zone_enable_cross_context_check = true;

/ **************************************** ************************************************** *********

  • Зона JS требуется по умолчанию для самой Angular.

    * /

import 'zone.js / dist / zone'; // Включено с Angular CLI.

/ ********************************************** ************************************************** ***

  • ИМПОРТ ПРИЛОЖЕНИЯ

    * /

// Добавить глобальное значение в окно, присвоив значение самому окну .

(окно как любое) ['global'] = окно;

if (! Element.prototype.matches) {

Element.prototype.matches = (<any>Element.prototype).msMatchesSelector ||

  Element.prototype.webkitMatchesSelector;

}

пакет. json {"name": "xtreme-admin- angular", "version": "0.0.0", "scripts": {"ng": "ng", "start": " Приложение узла. js "," build ":" ng build "," test ":" ng test "," lint ":" ng lint "," e2e ":" ng e2e "," postinstall ":" node patch-webpack. js "}," private ": true," dependencies ": {" @ agm / core ":" ^ 1.0.0-beta.7 "," @ angular / animations ":" ^ 7.0. 1 "," @ angular / common ":" ^ 7.0.1 "," @ angular / compiler ":" ^ 7.0.1 "," @ angular / core ":" ^ 7.0.1 "," @ angular / forms ":" ^ 7.0.1 "," @ angular / http ":" ^ 7.0.1 "," @ angular / platform-browser ":" ^ 7.0.1 "," @ angular / platform-browser-Dynami c ":" ^ 7.0.1 "," @ angular / router ":" ^ 7.0.1 "," @ jaspero / ng-co nfirmations ":" ^ 0.4.7 "," @ jaspero / ng2-Подтверждения ":" ^ 0.3.3 "," @ ng-bootstrap / ng- bootstrap ":" ^ 3.3.1 "," @ swimlane / ngx-charts ":" ^ 7.0.1 "," @ swimlane / ngx-datatable ":" ^ 13.1.0 "," @ types / crypto- js ":" ^ 3.1.43 "," angular -calendar ":" ^ 0.25.2 "," angular -datatables ":" ^ 6.0.0 "," angular2-notifications ":" ^ 2.0.0 "," bcrypt js ":" ^ 2.4. 3 "," bootstrap ":" ^ 4.1.3 "," c3 ":" ^ 0.4.23 "," chart. js ":" ^ 2.8.0 "," chartist ":" ^ 0.11. 3 "," classlist. js ":" ^ 1.1.20150312 "," сжатие ":" ^ 1.7.4 "," core- js ":" ^ 2.6.9 "," критический ":" ^ 1.3.6 "," crypto- js ":" ^ 3.1.9-1 "," d3 ":" ^ 4.8.0 "," datatables. net ":" ^ 1.10.16 "," datatables . net -dt ":" ^ 1.10.16 "," express ":" ^ 4.17.1 "," express -simple-cdn ":" ^ 1.0.1 "," jquery " : "^ 3.4.1", "jspdf": "^ 1.5.3", "jspdf-autotable": "^ 3.2.4", "karma- html -reporter": "^ 0.2.7", " karma-phantom js -launcher ":" ^ 1.0.4 "," karma-teamcity-reporter ":" ^ 1.1.0 "," ng-chartist ":" ^ 1.1.1 "," ng2-charts " : "^ 1.6.0", "ng2-dragula": "^ 1.5.0", "ng2-file-upload": "^ 1.3.0", "ng2-smart-table": "1.2 .2 "," ngx-loading ":" ^ 3.0.1 "," ngx-owl-carousel ":" ^ 2.0.7 "," ngx-owl-carousel-o ":" ^ 2.0.1 "," ngx-pagination ":" ^ 4.1.0 "," ngx-perfect-scrollbar ":" 6.1.0 "," ngx-quill ":" ^ 3.6.0 "," ngx-slick-carousel ":" ^ 0.4 .6 "," ngx-spinner ":" ^ 7.2.0 "," ngx-toastr ":" ^ 8.7.3 "," ngx-tooltip ":" 0.0.9 "," node-sass ":" ^ 4.12.0 "," owl.carousel ":" ^ 2.3.4 "," pace- js ":" ^ 1.0.2 "," quill ":" ^ 1.3.6 "," remove-node-modules ":" ^ 1.7.6 "," rx js ":" ^ 6.5.2 "," rx js -compat ":" ^ 6.5.2 "," script-loader ":" ^ 0.7.2 "," slick-carousel ":" ^ 1.8.1 "," web-animations- js ":" ^ 2.3.2 "," zone. js ":" ^ 0.8.29 "}," devDependencies ": {" @ angular -builders / custom-webpack ":" ^ 8.2.0 "," @ angular -devkit / build- angular ":" ^ 0.10.7 "," @ angular / cli ":" ~ 7.0.3 "," @ angular / compiler-cli ":" ^ 7.0.1 "," @ angular / language-service ":" ^ 7.0.1 "," @ types / c3 ":" ^ 0.6.4 "," @ types / chartist ":" ^ 0.9.46 "," @ types / datatables. net ":" ^ 1.10.17 "," @ types / jasmine ":" ~ 2.8.6 " , "@ types / jasminewd2": "~ 2.0.3", "@ types / jquery": "^ 3.3.22", "@ types / node": "~ 8.9.4", "codelyze r ":" ~ 4.2.1 "," css -aspect-ratio ":" ^ 1.0.5 "," jasmine-core ":" ~ 2.99.1 "," jasmine-spe c -reporter " : "~ 4.2.1", "Карма": "~ 1.7.1", "Карма- chrome -launcher": "~ 2.2.0", "Карма-охват-Стамбул-репортер": "~ 1.4. 2 "," karma-jasmine ":" ~ 1.1.1 "," karma-jasmine- html -reporter ":" ^ 0.2.2 "," транспортир ":" ^ 5.4.2 "," ts-node ":" ~ 5.0.1 "," tslint ":" ~ 5.9.1 "," typcript ":" 3.1.6 "}," browser ": {" crypto ": false," stream ": false}}

...