如何在Route Path Angular2中调用组件的特定功能

Question

I have to paths, http://localhost:3000/#/activateAccount/1341564455sdfr http://localhost:3000/#/resetPassword/1145gh5w2dd

and the code into the app.routes.ts File is

{ path: 'activateAccount/:temp_id', component: FrontGeneralComponent },
{ path: 'resetPassword/:reset_id', component: FrontGeneralComponent },

What I want that use only a Single component for both of these above URLs but I don't know how to call a specific function into the Component,

Suppose I have 2 functions into the Component, 1 for Account Activation and other for password reset, But how it can call that from routes call. Note: both are in the same component. and I want to call them based on routes path.

function activateAccount()
{
    // Code will go here to activate based on temp. id
}

function resetPassword()
{
    // Code will go here to reset password based on temp. id
}

Answer 1

to get the parameters of the activated route, you can inject activatedRoute.

You can make your component implements 'OnInit' interface from @angular/core, and then use the "ngOnInit" method which will be called by Angular when he creates your component.

In this method, you can check your parameters and according to them, call one function of another. Something like that :

class myComponent implement OnInit {
   
   constructor (private activatedRoute: ActivatedRoute) {}

   ngOnInit () {
      this.activatedRoute.params.subscribe((params) => {
          if (params['temp_id']) { this.activateAccount(); }
          else if (params['reset_id']) { this.resetPassword(); }
      });
   }

}

Finally, I warn you that having a component like that is not a good practice. A component is suppose to do one thing and one only. You are creating a single component which have multiple behavior according to the route. It would be better to have two different components. Or at least a parent component and some children, one which can activate an account, the other to reset a password.

Hope that helps