Redirect from external url to my angular 4 application with post data

Question

I have an angular 4 application & I want to add payment in my app when user send new payment to my server, I return some data to user and user will send this data with RedirectUrl. after completion of the payment it will redirect to one url with post data but in my application i gave the angular route url but it is showing below exception Cannot POST /app-root. how to get the response from external link..please help me.

you should like pass in the url some key, then in the onInit of your main component, do the logic. — Jacopo Sciampi
Thank you, Can you give an example for the above answer..I am unable to call — Yamuna

Jacopo Sciampi Jacopo Sciampi · Accepted Answer · 2018-11-20T07:47:46

Well, since I am unable to do a stackblitz, I've done it on my pc. Here's the struct:

App.module

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';


import { AppComponent } from './app.component';
import { SecondComponent } from './second.component';
import { Routes, RouterModule } from '@angular/router';

const appRoutes: Routes = [
  {
    path: 'test/:id',
    component: SecondComponent
  },
  {
      path: '**',
      component: AppComponent
  }
];

@NgModule({
  declarations: [
    AppComponent,
    SecondComponent
  ],
  imports: [
    BrowserModule,
    RouterModule.forRoot(appRoutes)
  ],
  providers: [],
  bootstrap: [AppComponent],
})
export class AppModule { }

Second component

import { Component, OnInit } from '@angular/core';
import { ActivatedRoute } from '@angular/router';

@Component({
  selector: 'app-root',
  template: '<span>Second Component</span>',
})
export class SecondComponent implements OnInit {
    public id: number;

  constructor(
    private route: ActivatedRoute,
  ) { }

  ngOnInit(){
    this.route.paramMap.subscribe((params: any) => {
      this.id = params.params.id;
      //Do some logic with the id
    }) 
  }
}

app.component.html

<router-outlet></router-outlet>

app.component.ts is empty:

import { Component } from '@angular/core';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {

}

In the second component you have the id passed in the url as a variable. You can use that id to call a service that do something

Redirect from external url to my angular 4 application with post data

1 Answers