title: Escaping forward slash in javascript when passing parameters to the url
body: <p>I am sending a request to a Web API from my javascript code as follows:</p>
  
  <blockquote>
    <p><a href="http://localhost:49358/api/myClasses/GetMyData/first%20second/third%20fourth%2Ffifth" rel="nofollow noreferrer">http://localhost:49358/api/myClasses/GetMyData/first%20second/third%20fourth%2Ffifth</a></p>
  </blockquote>
  
  <p>where</p>
  
  <blockquote>
    <p><a href="http://localhost:49358/api/myClasses/GetMyData/" rel="nofollow noreferrer">http://localhost:49358/api/myClasses/GetMyData/</a></p>
  </blockquote>
  
  <p>is my controller method to which i am passing two parameters <code>first second</code> and <code>third fourth/fifth</code></p>
  
  <p>A whitespace gets escaped automatically by <code>%20</code> automatically and <code>/</code> I escape using <code>%2F</code> </p>
  
  <p>The issues is that the url call above returns error 404. Meanwhile if I replace <code>third fourth/fifth</code> by any valid value not containing forward slash, everything works just fine. </p>
  
  <p>Could anyone point me in the right direction?</p>
  
  <p>My controller code is below:</p>
  
  <pre><code>(function () {
    angular.module("myApp").controller("MyController", ["$scope", "$state", "$http", MyFunction]);
  
    function MyFunction($scope, $state, $http) {
      $scope.MyClass1=[];
      $http.get('http://localhost:49358/api/myClasses/GetMyData/' + $scope.$parent.param1 + '/' + encodeURIComponent($scope.$parent.param2))
        .then(function (result) {
          $scope.MyClass1 = result.data;
      });
    };
  })();
  </code></pre>