Tiny mce content is not available inside ngOndestroy life cycle Angular

[gregoire31]

What is the current behavior?

The tinyMce content is not available inside ngOnDestroy of Angular

Please provide the steps to reproduce and if possible a minimal demo of the problem via [codesandbox.io](https://codesandbox.io/s/6zlmmkkk1n?fontsize=14) or similar.

What is the expected behavior?

The tinyMce content is available inside ngOnDestroy

Which versions of TinyMCE/TinyMCE-Angular, and which browser / OS are affected by this issue? Did this work in previous versions of TinyMCE or TinyMCE-Angular?

Chrome Version 110.0.5481.178 (Build officiel) (64 bits) (personal project : "@tinymce/tinymce-angular": "^7.0.0", / Angular 14.2.12) (sandbox : "@tinymce/tinymce-angular": "^3.3.0", / Angular 5.2.0)

[exalate-issue-sync[bot]]

Ref: INT-3165

[gregoire31]

I've tried to remove the life cycle ngOnDestroy of angular to call the ngOnDestroy of tinymce. Same result.

When you ty to get the content of tinymce inside the ngOnDestroy function of tinymce, the content is empty.

[lorenzo-pomili]

ngOnDestroy should be used for cleanup so not having the content in ngOnDestroy is the correct behavior, could you explain what is you case of use?

[gregoire31]

Hey, thanks you for reply We need to have the content of tinymce content on the ngOnDestroy because there is many way to destroy the content and we want automaticaly save the content of the tinymce content

In our application, we have created a custom mailer and we need to save draft email each time the user switch mail or go to another directory or anything else. That's why we have decided to save the content at the ngOnDestroy

I don't agree with your ngOnDestroy behaviour if you call any property of a custom class inside your ngOnDestroy you will have the content of that property

the behaviour inside the ngOnDestroy of tinyMce is not the same as the ngOnDestroy of a custom class

maybe it's a asynchronous problem

ngOnDestroy() { const content = this.tinyEditor.editor.getContent(); alert("content : " + content); alert("title : " + this.title); }

i have the value of the property this.title I don't have the value of the property content (this.tinyEditor.editor.getContent())

The solution should be : async ngOnDestroy() { const content = await this.tinyEditor.editor.getContent(); alert("content : " + content); alert("title : " + this.title); }

But this.tinyEditor.editor.getContent() is not a promise so i cannot do that

[danoaky-tiny]

While you are right, you can access child component's props in this way (as you have in your code sandbox). In my view, it's technically trying to access 2 children down the tree by calling getContent. The Editor component is a wrapper for the TinyMCE editor instance, which has the getContent method. So as @lorenzo-pomili has said it makes sense that this is the current functionality. The ngOnDestroy hook is really the only place we can do clean up on our end (within the Editor component), so we can't get around that part. Considering your use case, maybe you can query the editor's content at the other points in your app when you know the mailing service you have is being navigated away from, e.g. a modal closing callback or whatever it may be.

[danoaky-tiny]

As this has become stale, I'm closing this for now. Feel free to re-open a new issue if needed.