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…

Vignesh Ravichandran
- 169
- 3
- 10
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;
…

Igor Tvardyi
- 37
- 5
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,…

John Mikel
- 15
- 2
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