Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

create toaster in div container #147

Closed
DuncanFaulkner opened this issue Jul 18, 2017 · 9 comments
Closed

create toaster in div container #147

DuncanFaulkner opened this issue Jul 18, 2017 · 9 comments
Assignees

Comments

@DuncanFaulkner
Copy link

Trying to get toaster into own div container, but doesn't appear to be working, followed instructions in readme. the toaster does appear just not from the container i was expecting.

are there any additional steps or an example of this working some where?

Cheers

@scttcper scttcper self-assigned this Jul 18, 2017
@scttcper
Copy link
Owner

I've updated the readme with more clear instructions. Let me know if that gets you anywhere.

https://github.com/scttcper/ngx-toastr/blob/master/README.md#put-toasts-in-your-own-container

Put up a repo where I have it working https://github.com/scttcper/toastrdiv

@DuncanFaulkner
Copy link
Author

Thanks, will take a look at this later.

@DuncanFaulkner
Copy link
Author

Thanks for the updated readme and examples but needed to add other directives to the div and no matter what I tried the additional directives just didn't seem to get picked.
Thanks again, will revisit this issue when I can get to it.

@ceoaliongroo
Copy link

Hi readme not work to me! I want to open the toast inside a DIVtoo

The toast do not appears, if i change positionClass appears according the css class, but overlay not inside a dive with the directive.

@scttcper
Copy link
Owner

@ceoaliongroo please create a new issue.

@muniom
Copy link

muniom commented Sep 20, 2017

I also have this same issue, it is not another issue, does not work as per readme

update: made a plnkr to demo, & of course it works... still not entirely sure why it wasn't working elsewhere, but figured i should update this post with a demo. It was possibly wither silently swallowing a ExpressionChangedAfterItHasBeenCheckedError as putting the first notification into a timeout i think helped
Working demo toastContainer in childComponent: https://embed.plnkr.co/yiXiqmmJt3BwrYj0JZOl

update2: My issue was that ToastContainerDirective was not being registered globally by ToastContainerModule.forRoot(). Instead, putting ToastContainerDirective in the Declarations & Exports of my shared.module made @ViewChild(ToastContainerDirective) actually return something in components other than just app.component

@scttcper scttcper reopened this Sep 20, 2017
@scttcper
Copy link
Owner

scttcper commented Oct 6, 2017

@muniom you're right. ToastContainerModule needs to be imported in the module where you're trying to use it. Having a forRoot function on it is misleading. I've removed that in 6.4.0.

Please import ToastContainerModule where you need the directive available.

@adlh
Copy link

adlh commented Nov 13, 2019

I also had the problem, that this only worked for standard toasts. Custom toasts were not placed on the container. Adding {static: true} to the @ViewChild declaration seems to fix the problem.

@feitzi
Copy link

feitzi commented Dec 3, 2019

@adlh you are right. It works for me after adding static true.
@scttcper can you maybe update the documentation?

  @ViewChild(ToastContainerDirective, {static: true}) toastContainer: ToastContainerDirective;

scttcper added a commit that referenced this issue Dec 3, 2019
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

6 participants