Activity

1. petebacondarwin commented on Jul 14, 2020

   

   petebacondarwin

   on Jul 14, 2020

   Contributor

   More actions

   This is kind of a duplicate of #30497, which is fixed by #35464. But in your case, you appear to be changing the onDestroy() method on the instance, whereas that PR will only allow you to change the method on the prototype.

   I think you could workaround this right now by creating your class like:

   @Component(...)
   export class MyComponent implements NgOnDestroy {
     onDestroy() {
       this._onDestroy();
     }
   
     private _onDestroy() {}
   
     constructor() {
       this._onDestroy = () => {
         alert('Invoke');
       };
     }
   }

   👍React with 👍1Reacted by Sachin Grover
2. petebacondarwin

   added

   area: coreIssues related to the framework runtimeIssues related to the framework runtime

   core: lifecycle hooks

   state: confirmed

   type: bug/fix

   on Jul 14, 2020
3. ngbot

   added this to the needsTriage milestone on Jul 14, 2020
4. spock123 commented on Jul 22, 2020

   

   spock123

   on Jul 22, 2020

   Last edited by spock123

   More actions

   @petebacondarwin there is no way to use arrow functions in general as lifecycle hooks, is there?

   Is this because of some framework issue (inheritance) or is it a Typescript issue? It's just for aesthetics, doing hooks as regular functions and all other methods as fat arrow functions just looks weird to my ocd brain ;)
5. petebacondarwin commented on Jul 23, 2020

   

   petebacondarwin

   on Jul 23, 2020

   Contributor

   More actions

   @spock123 - I don't understand the question here. Could you give a concrete example of what is not working for you?
6. spock123 commented on Jul 23, 2020

   

   spock123

   on Jul 23, 2020

   Last edited by spock123

   More actions

   @petebacondarwin I'm sorry I did not intend to hijack this issue but I guess it's somewhat related:

   If I have a component with the following code ngOnInit method:

   ngOnInit = () => console.log('Hello Init');

   • won't be called by the framework.

   However this will be called:

   ngOnInit() { console.log('Hello Init'); }

   I was just wondering if it was somehow possible to use fat arrow functions when creating component lifecycle hooks
7. petebacondarwin commented on Jul 24, 2020

   

   petebacondarwin

   on Jul 24, 2020

   Contributor

   More actions

   Sorry @spock123 - I am still not sure what the problem is here. The ngOnInit() method must be defined (even after #35464) before the app bootstraps. The following works for me:

   @Component({selector: 'app-root', template: ''})
   export class AppComponent {
     title = 'test-app';
   }
   
   (AppComponent.prototype as any).ngOnInit = () => {
     console.log('init!');
   };
8. spock123 commented on Jul 24, 2020

   

   spock123

   on Jul 24, 2020

   More actions

   @petebacondarwin thank you for your explanation.

   This syntax is just a bit. .. weird.. having to add it to the prototype is not what I had in mind, I just wanted to use the fat arrow syntax directly in the component when creating component hooks.

   But this is really hijacking this issue, I'm sorry for the derailing. I'll experiment more with how to use fat arrow functions.

   Cheers
9. petebacondarwin commented on Jul 24, 2020

   

   petebacondarwin

   on Jul 24, 2020

   Contributor

   More actions

   Using it directly in the component is effectively the same as doing it in the constructor. This has two problems:

   1. It only changes the instance of the component and not the prototype, which Ivy will not consider. It only looks at the prototype.
   2. It is too late for Ivy since it reads the prototype of the component at build time and takes a reference to the method.
10. pkozlowski-opensource commented on Jul 27, 2020

    

    pkozlowski-opensource

    on Jul 27, 2020

    Member

    More actions

    This currently works as designed - I've opened a new feature request with more info: #38241
11. pkozlowski-opensource

    closed this as completedon Jul 27, 2020
12. angular-automatic-lock-bot commented on Aug 27, 2020

    

    angular-automatic-lock-botBot

    on Aug 27, 2020

    More actions

    This issue has been automatically locked due to inactivity.
    Please file a new issue if you are encountering a similar or related problem.

    Read more about our automatic conversation locking policy.

    _{This action has been performed automatically by a bot.}
13. angular-automatic-lock-bot

    locked and limited conversation to collaborators on Aug 27, 2020