Angularjs pass web adders as parameter

Question

i am trying to pass a web address as a parameter between views in angular but it is not working.

i am using the uiRouter and have nested states.

here is the code:

 .state('tab', {
url: '/tab',
abstract: true,
templateUrl: 'templates/tabs.html'
})  
.state('tab.chat-detail', {
  url: '/home/:url1/:url2',
  views: {
    'tab-home': {
      templateUrl: 'templates/chat-detail.html',
      controller: 'ChatDetailCtrl'
    }
  }
})

i am passing links in the url as:

 href="#/tab/home/www.somepage.com/nesteded?id=99/www.second.com/page/one/more"

i am sure the slashes / are causing the problem here.

score 0 · Answer 1 · answered Jul 25 '15 at 16:33

Your problem is that www.second.com/page/one/more is missing a protocol. Without the protocol if you just pass that to href browser will interpret it as a relative url.

You either need to correct the source or parse the source to check if it has a protocol before using it in your view

Without more code provided there isn't much more help can be provided

score 0 · Answer 2 · edited May 23 '17 at 12:29

Use percent encoding: https://en.wikipedia.org/wiki/Percent-encoding. For a slash, you need to put %2F instead. Use a URL encoder/decoder to do it: http://www.url-encode-decode.com/

Input is http://www.somepage.com/nesteded?id=99, so your URL encoded URL would be http%3A%2F%2Fwww.somepage.com%2Fnesteded%3Fid%3D99, and your link <a href="#/tab/home/http%3A%2F%2Fwww.somepage.com%2Fnesteded%3Fid%3D99/http%3A%2F%2Fwww.second.com%2Fpage%2Fone%2Fmore">

You can write a filter link in this stack overflow question to make it easier: How to generate url encoded anchor links with AngularJS?

Angularjs pass web adders as parameter

2 Answers2