How to catch query string in angular js
•Download as DOCX, PDF•
0 likes•380 views
This document discusses how to use $Location in AngularJS to catch query strings when passing values between pages. It explains that query strings must use "#?" and provides an example of passing the parameter "accountNo=1001" from index.html to index1.html. Index1.html then uses $location.search() to catch the "accountNo" parameter and display it on the page.
Recommended
More Related Content
Similar to How to catch query string in angular js
Similar to How to catch query string in angular js (20)
More from codeandyou forums
More from codeandyou forums (16)
Recently uploaded
Recently uploaded (20)
How to catch query string in angular js
- 1. How to catch query string in AngularJs using $Location
- 2. Whenwe use AngularJsandwant passsome value fromone page to anotherpage. We have optionstouse $Location to catch querystring.TodayI am showinghow touse $Location to catch QueryString. Plnkr - http://plnkr.co/edit/TNX06WFx0n6p1mSLPKfP?p=preview Followingcode pass"accountNo"paramerterwith "1001" value toindex1.html.We will catchthat parameterintoindex1.htmlpage. Note:Whenyoupassingquerystringfromone page to anotherpage must use "#?" to passquerystring. Use followingformattopassquerystring. " #?accountNo=1001" Index.html <!DOCTYPE html> <html> <head> <title>Howto catch query stringin AngularJs</title> <linkrel="stylesheet"href="http://getbootstrap.com/2.3.2/assets/css/bootstrap.css"> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.4/angular.js"></script> </head> <body ng-app="queryStringApp"> <div ng-controller="firstCtrl"> <h3> Catch query string inAngularJs with $Location </h3> For pass query string to another page use followingformat <br><br> " #?accountNo=1001" <br> <br> <br> <a href="index1.html#?accountNo=1001">click here to password querystring to anotherpage </a> </div> </body> </html>
- 3. Index1.html <!DOCTYPE html> <html> <head> <title>Howto catch query stringin AngularJs</title> <linkrel="stylesheet"href="http://getbootstrap.com/2.3.2/assets/css/bootstrap.css"> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.4/angular.js"></script> <script> var app = angular.module('queryStringApp',[]); app.controller('firstCtrl',function($scope,$location) { alert("AccountNumber is - "+ $location.search()['accountNo']); $scope.accountNo=$location.search()['accountNo']; }); </script> </head> <body ng-app="queryStringApp"> <div ng-controller="firstCtrl"> Account No - {{accountNo}} </div> </body> </html>