Lost FadeIn effect toastr after update angular to v7

[veronesecoms]

Before i update angular to v7 my toastr was doing a fadeIn effect.

After the update, only fadeOut is working.

ng version

Angular CLI: 7.3.5
Node: 8.11.3
OS: win32 x64
Angular: 7.2.8
... animations, common, compiler, compiler-cli, core, forms
... http, language-service, platform-browser
... platform-browser-dynamic, platform-server, router

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.13.6
@angular-devkit/build-angular     0.13.6
@angular-devkit/build-optimizer   0.13.6
@angular-devkit/build-webpack     0.13.6
@angular-devkit/core              7.3.5
@angular-devkit/schematics        7.3.5
@angular/cdk                      7.3.3
@angular/cli                      7.3.5
@angular/material                 7.3.3
@ngtools/webpack                  7.3.6
@schematics/angular               7.3.5
@schematics/update                0.13.5
rxjs                              6.4.0
typescript                        3.2.4
webpack                           4.29.0

my ngx-toastr version:

"ngx-toastr": "^9.1.2",

My package.json:

  "dependencies": {
    "@angular/animations": "^7.2.8",
    "@angular/cdk": "^7.3.3",
    "@angular/common": "^7.2.8",
    "@angular/compiler": "^7.2.8",
    "@angular/core": "^7.2.8",
    "@angular/forms": "^7.2.8",
    "@angular/http": "^7.2.8",
    "@angular/material": "^7.3.3",
    "@angular/platform-browser": "^7.2.8",
    "@angular/platform-browser-dynamic": "^7.2.8",
    "@angular/platform-server": "^7.2.8",
    "@angular/router": "^7.2.8",
    "angular-bootstrap-md": "^7.0.0",
    "angular-resizable-element": "^3.2.2",
    "angular-validate-br": "0.1.0-beta",
    "angular2-text-mask": "^9.0.0",
    "chart.js": "^2.7.3",
    "core-js": "^2.6.5",
    "font-awesome": "^4.7.0",
    "hammerjs": "^2.0.8",
    "ng2-brpipes": "^1.2.0",
    "ng2-charts": "^1.6.0",
    "ngx-brazilian-helpers": "^0.3.0",
    "ngx-currency": "^1.5.1",
    "ngx-currency-mask": "^4.3.2",
    "ngx-filter-pipe": "^2.1.2",
    "ngx-image-cropper": "^1.2.5",
    "ngx-mask": "^7.3.0",
    "ngx-show-hide-password": "^1.2.6",
    "ngx-toastr": "^9.1.2",
    "rxjs": "^6.4.0",
    "rxjs-compat": "^6.4.0",
    "zone.js": "^0.8.29"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "^0.13.6",
    "@angular/cli": "^7.3.5",
    "@angular/compiler-cli": "^7.2.8",
    "@angular/language-service": "^7.2.8",
    "@types/jasmine": "^3.3.9",
    "@types/jasminewd2": "~2.0.3",
    "@types/node": "^11.10.5",
    "codelyzer": "^4.5.0",
    "jasmine-core": "^3.3.0",
    "jasmine-spec-reporter": "^4.2.1",
    "karma": "^4.0.1",
    "karma-chrome-launcher": "^2.2.0",
    "karma-cli": "^2.0.0",
    "karma-coverage-istanbul-reporter": "~2.0.0",
    "karma-jasmine": "^2.0.1",
    "karma-jasmine-html-reporter": "^1.4.0",
    "protractor": "^5.4.2",
    "rxjs-tslint": "^0.1.7",
    "ts-node": "~5.0.1",
    "tslint": "^5.13.1",
    "typescript": "3.2.4",
    "sass-loader": "*",
    "sass": "*"
  }

[foxgeeek]

I am also not able to use the plugin after updating to the angular v7.

[scttcper]

newer versions of ngx-toastr fix this issue. please upgrade.

[TKul6]

Hi @scttcper I've just upgraded my application to Angular 9, and unfortunately I have the same issue. There is no fade in animation when toast enters, but there is animation on leave.

Any chance you have a solution for that (all I did was upgrade the package to the latest).

Thanks

[scttcper]

What’s in package.json

[TKul6]

"dependencies": { "@angular/animations": "^9.1.0", "@angular/cdk": "^9.2.0", "@angular/common": "^9.1.0", "@angular/compiler": "^9.1.0", "@angular/core": "^9.1.0", "@angular/forms": "^9.1.0", "@angular/http": "^7.1.4", "@angular/localize": "^9.1.0", "@angular/material": "^9.2.0", "@angular/platform-browser": "^9.1.0", "@angular/platform-browser-dynamic": "^9.1.0", "@angular/platform-server": "^9.1.0", "@angular/router": "^9.1.0", "@auth0/angular-jwt": "^1.0.0-beta.9", "@ng-idle/core": "^8.0.0-beta.4", "@ngrx/core": "^1.2.0", "@ngrx/effects": "^8.6.0", "@ngrx/store": "^8.6.0", "@ngrx/store-devtools": "^8.6.0", "@types/node": "^13.9.8", "angular-split": "^3.0.2", "bootstrap": "4.0.0-alpha.6", "core-js": "^2.4.1", "crypto": "^1.0.1", "file-saver": "^2.0.1", "hash-it": "^4.0.1", "highcharts": "^7.1.3", "highcharts-angular": "^2.4.0", "json-schema-traverse": "^0.3.1", "jsonwebtoken": "^7.3.0", "karma-typescript": "^5.0.1", "map.prototype.tojson": "^0.1.3", "material-design-icons": "^3.0.1", "negotiator": "^0.6.1", "ng-drag-drop": "^5.0.0", "ng2-filter-pipe": "^0.1.10", "ng2-webstorage": "^1.5.0", "ngx-simple-crypt": "^1.0.1", "ngx-toastr": "^12.0.1", "node-sass": "^4.12.0", "reflect-metadata": "^0.1.9", "rxjs": "^6.5.4", "rxjs-compat": "^6.2.0", "serve-favicon": "^2.3.2", "stream": "0.0.2", "timers": "^0.1.1", "uuid": "^7.0.1", "xml2js": "0.4.19", "zone.js": "~0.9.1" }, "devDependencies": { "@angular-devkit/build-angular": "^0.901.0", "@angular/cli": "^9.1.0", "@angular/compiler-cli": "^9.1.0", "@angularclass/hmr": "^1.2.2", "@angularclass/hmr-loader": "^3.0.2", "@types/file-saver": "^2.0.0", "@types/jasmine": "^2.6.2", "@types/jsonwebtoken": "^7.2.0", "@types/method-override": "0.0.29", "@types/mime": "0.0.29", "@types/request-promise": "^4.1.38", "@types/serve-static": "^1.7.31", "@types/systemjs": "^0.20.6", "@types/xml2js": "^0.4.4", "codelyzer": "^5.2.2", "jasmine": "^2.9.0", "jasmine-core": "^2.9.0", "jasmine-marbles": "^0.3.1", "jasmine-spec-reporter": "~3.2.0", "karma": "^1.7.1", "karma-chrome-launcher": "^2.0.0", "karma-cli": "~1.0.1", "karma-coverage-istanbul-reporter": "^1.0.0", "karma-jasmine": "~1.1.0", "karma-jasmine-html-reporter": "^0.2.2", "karma-mocha": "^1.3.0", "karma-tfs-reporter": "^1.0.1", "primeng": "^6.0.0", "protractor": "5.1.1", "puppeteer": "^1.12.2", "ts-helpers": "^1.1.2", "ts-node": "^3.0.2", "tslint": "^4.5.1", "typescript": "^3.5.3", "webdriver-manager": "10.2.5" },

Thanks @scttcper