Questions tagged [ngx-toastr]

46 questions
1
vote
0 answers

ngx-toastr in Angular 9 App with container in one child component

I am using ngx-toastr to display notification messages. but I want to display the message only in one child component (and the width should be adjusted according to the width of the child component). when the user navigates to another route, it…
Sahi
  • 1,454
  • 1
  • 13
  • 32
1
vote
1 answer

How to adjust the width of the toastr message in Angular

I have toastr message notification using ngx-toastr from npm (my current stack is Angular 9) Is there a way to alter the max-width for the messages since it is causing the message-text to wrap. this.toastrService.error( 'This is an error…
1
vote
1 answer

ngx-toastr styling not working in Angular 9

I'm a beginner at Angular and I need to add a notification to a preexisting code. I've installed toastr successfully and the notification div actually appear, but it's like the css not working at all. I'm using this at my scss: @import…
v1n_vampire
  • 1,575
  • 3
  • 13
  • 21
1
vote
1 answer

ngx-toaster not working properly in inline configuration for lazily loaded child module

I am trying to use ngx-toaster in my angular 9+ application in inline mode to show it inside one of the divs. Its working fine in app.component HTML. But working unexpectedly inside lazily loaded child components. It's not coming inside the div but…
user9040429
  • 690
  • 1
  • 8
  • 29
1
vote
1 answer

How to make Angular animation working properly

I'm using ngx-toastr (uses angular/animations) to show toasts. If I trigger them from event created manually then I have significant delay in animation. export class AppComponent { @ViewChild('iframeElement') iframeElement: ElementRef; …
1
vote
1 answer

Change ngx-toastr default style using enableHtml property. Angular 7

I'm using toastr to display messages and I have and error message that comes with an url with the solution so I'm using the enableHtml property from toastr to create and
user8084037
1
vote
2 answers

Toaster (ngx-toastr) top-center alignment doesn't have top margin

I'm using the ngx-toastr library. I'm launching a message positioned at the top-center of the screen like this: @Injectable() export class MessageService { constructor(private toastrService: ToastrService) { } showErrorMessage(message:…
Ricardo Rocha
  • 14,612
  • 20
  • 74
  • 130
0
votes
3 answers

Show toastrs after the previous toastr is dismised

I have multiple messages. I want to show next toastr after the toastr is dismissed. I write the following codes: this.messages.forEach(msg=>{ this.toastr.info(msg.Text, 'Title', { positionClass: 'toast-top-right', closeButton: true, …
MB_18
  • 1,620
  • 23
  • 37
0
votes
1 answer

Property 'get' in type 'ToastInjector' is not assignable to the same property in base type 'Injector'

error TS2416: Property 'get' in type 'ToastInjector' is not assignable to the same property in base type 'Injector'. Type '(token: any, notFoundValue?: T, flags?: InjectFlags) => ToastPackage | T' is not assignable to type '{ (token: ProviderToken,…
0
votes
0 answers

Upgrade my project and my external third library from Angular 11 to 12 fails because of dependencies to "ngx-filesaver" and "ngx-toastr" in my library

Important : the external third library is published on a public NPM repository. It is very annoying because it means we need to publish a new version on the repository every time we do a change, even if it is a very small one. We should look for a…
JTHOUMEL
  • 31
  • 2
0
votes
0 answers

How to render and display emoji in in ngx-toastr notification?

I use ngx-toastr in an angular app to pass and display a notification to the end user. The notification messages are provided by a back-end after a HTTP Request. Some of the returned notifications are in markdown format and they contain emojis. Am…
k.vincent
  • 3,743
  • 8
  • 37
  • 74
0
votes
0 answers

Dynamic global configuration for toastr

Am using ngx-toastr lib for couple of notifications and different use cases. All works fine. The only point am still struggling with, is a dynamic global configuration. I mean the one used in app.module.ts: imports: [ ... …
k.vincent
  • 3,743
  • 8
  • 37
  • 74
0
votes
0 answers

is it possible to change the close icon of ngx-toastr using css in angular?

this is how it should look like this is how it's looking right now I want to add this close button or icon (referred in the first image link) in my toastr. I have tried to override it by using image and icon but nothing works because it's harcoded…
Arian
  • 1
0
votes
1 answer

When trying to add ToastrModule.forRoot to imports the forroot throws an error

I am currently making a project with angular and am trying to add the ngx toastr. I have added the ToastrModule as well as the BrowserModule and BrowsernAnimationsModule in my imports. Adding ToastrModule.forRoot() shows the following error: TS2322:…
B. Bakker
  • 21
  • 7
0
votes
0 answers

ngx-toastr gives injection context error in hybrid Angular app using ngUpgrade

I am getting an error as soon as I declare ngx-toastr in my Hybrid AngularJS-Angular12 app: angular.js:15697 Error: inject() must be called from an injection context at injectInjectorOnly (core.umd.js:5072:1) at ɵɵinject (core.umd.js:5083:1) at…
rikuwolf
  • 103
  • 2
  • 10