Pass query string from index.html to Angular2 component

Question

I need some help in accessing query string from index.html in Angular2 component. I have followed this link but it did not work for me link

my index.html

<!doctype html>
<html>
<head>
  <base href="/">
  <!-- css importd -->
</head>
<body> 
   <app-root>Loading .. </app-root>
</body>
</html>

app.component.ts

...
public constructor(private activatedRoute:ActivateRoute) {}
ngOnInit() {
  this.activateRoute.queryParams.subscribe((params:Params) => {
      console.log(params['code']);
  });
}

And I am invoking url http://localhost:8080/?code=test

I did not follow you .. how can I set query parameters in template ..? they are coming url. Thanks — Nuthan Kumar
– Nuthan Kumar, Commented May 10, 2017 at 5:16
Sorry for the mistake, I want to see your HTML code that passes queryparams — Jayakrishnan
– Jayakrishnan, Commented May 10, 2017 at 5:17
I am also facing the same issue. Nuthan, Is it resolved for you? — Hrushikesh Patel
– Hrushikesh Patel, Commented Nov 19, 2017 at 5:20
No , I am using local storage to pass data to agnular components — Nuthan Kumar
– Nuthan Kumar, Commented Nov 20, 2017 at 19:46

Jayakrishnan · Accepted Answer · 2017-05-10 16:33:42Z

1

Try this:

constructor(private route: ActivatedRoute) { }

ngOnInit() {
    // get param
    let paramcode = this.route.snapshot.queryParams["code"];
}

answered May 10, 2017 at 16:33

Jayakrishnan

4,3043 gold badges25 silver badges41 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Harleen Kaur Arora · Accepted Answer · 2017-05-10 05:53:54Z

0

Try this :-

this.activateRoute.queryParams.subscribe(queryParams =>
 console.log(queryParams['code']);
);

Add your html is code :-

<router-outlet></router-outlet>

answered May 10, 2017 at 5:53

Harleen Kaur Arora

2,0872 gold badges27 silver badges59 bronze badges

1 Comment

Nuthan Kumar Over a year ago

no luck, i changed template to use <router-outlet></router-outlet>

Collectives™ on Stack Overflow

Pass query string from index.html to Angular2 component

2 Answers 2

Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related