Having problems with question marks inside or the url with angularjs

Question

I am having a few problems with allowing users to view a post that has a question mark or multiple in the post name. When the url mysite.com/posts/user/postname is visited angular picks up the :user and :postName and retrieves the neccessary data, but if the :postName contains one or more question marks it seems to break the route and the page can't find the post since it doesn't match the actual post name with the question marks. However if I type in the postname with ascii version of a question mark %3f it works and displays the correct data.

I either want to rewrite the url to replace ? with %3f or fix my angular script. the route looks like below, and the relevant part of the controller is listed below.

.when('/posts/:postUser/:postName', {
                title: 'View Post',
                templateUrl: 'posts/view-post.php',
                controller: 'userSingleCtrl',
                resolve: {
                    post: function(services, $route) {
                        var postName = $route.current.params.postName;
                        var postUser = $route.current.params.postUser;
                        return services.getUserSingle(postName, postUser);
                        return services.getComments(postName, postUser);
                    }
                }
            })

Controller:

var postName = ($routeParams.postName) ? $routeParams.postName : 'Doesnt Exist';
    var postUser = ($routeParams.postUser) ? $routeParams.postUser : 'Doesnt Exist';
    var original = post.data;
    original._name = postName;
    original._user = postUser;
    $scope.post = angular.copy(original);
    $scope.post._name = postName;
    $scope.post._user = postUser;

Just in case any current htaccess rules are causing this and not actually angular heres my htaccess as well.

RewriteEngine On
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^/?(.*)$ /#/$1 [L,QSA]

 <IfModule mod_expires.c> 
   ExpiresActive off 
ExpiresByType text/html "access 1 month" 
ExpiresByType text/css "access 1 month" 
ExpiresByType application/javascript "access 1 month" 
ExpiresByType text/javascript "access 1 month" 
   ExpiresByType text/plain "access 1 month" 
   ExpiresByType image/jpg "access 1 month" 
   ExpiresByType image/jpeg "access 1 month" 
   ExpiresByType image/gif "access 1 month" 
   ExpiresByType image/png "access 1 month" 
   ExpiresByType application/pdf "access 1 month" 
   ExpiresByType application/x-shockwave-flash "access 1 month" 
   ExpiresDefault "access 2 days" 
  </IfModule> 

<IfModule mod_deflate.c>
<FilesMatch "\.(html|php|txt|xml|js|css)$">
SetOutputFilter DEFLATE
</FilesMatch>
</IfModule>

score 1 · Accepted Answer · edited May 23 '17 at 11:44

1

The following link shows an example of using an angular filter to apply uri encoding. You could probably do the same thing where you generate your post links to encode the ? (and other characters) into valid uri.

How to generate url encoded anchor links with AngularJS?

edited May 23 '17 at 11:44

Community

1
1

answered Nov 10 '15 at 00:37

Dave

1,533
1
19
23

This is perfect thankyou, I added the filter and passed the escape filter into the actual ng-href refreshed and the page loads perfectly with %3F in the url! – Spade Nov 10 '15 at 00:43

Having problems with question marks inside or the url with angularjs

1 Answers1