Angular.js routes not working on WAMP

Question

I am working on setting up an Angular.js single page application built with an Express, Node, mySQL stack. I have set up the following code for the routes:

angul         


        

Answer 1

Personnaly i always use a vhost when i need url rewriting. Maybe it could solve your problem:

I. Active apache module rewrite_module, one solution is to click on the WAMP icon in the right of your task bar:

 wamp -> Apache -> Apache modules -> check rewrite_module

II. Open the file httpd.conf (wamp -> Apache -> httpd.conf) and uncomment the line :

Include conf/extra/httpd-vhosts.conf

III. Open the file httpd-vhosts.conf:

wamp -> bin -> apache x.y.z -> conf -> extra

and add

<VirtualHost *:80>
    ServerAdmin webmaster@dummy-host.example.com
    DocumentRoot "C:/PATH/TO/MYAPP"
    ServerName myapp.test
    ServerAlias www.myapp.test
    ErrorLog "logs/myapp-error.log"
    CustomLog "logs/myapp-access.log" common
    <Directory "C:/PATH/TO/MYAPP">
        Options Indexes FollowSymLinks
        AllowOverride all
    #   onlineoffline tag - don't remove
        Require local
    </Directory>
</VirtualHost>

IV. Open Notepad with admin rights and open

C:\Windows\System32\drivers\etc\hosts

and add

127.0.0.1 myapp.test
127.0.0.1 www.myapp.test

try your new url http://myapp.test/todos

Hope it could help.

Answer 2

mod_alias or aliasmatch might be helpful.

http://httpd.apache.org/docs/2.2/mod/mod_alias.html

You basically need to serve your script contents at any URL that is a valid route for your application.

I think this would do it:

AliasMatch ^/todos(.*) /
AliasMatch ^/deletePost(.*) /
AliasMatch ^/editPost(.*) /
...

One thing to be careful of, if your application needs to actually fetch content back to the user (such as your templates) make sure they are not under the same directory structure that's being aliased for your routes.

For example, if you had a template called "todos/todos.html", when the browser tried to fetch it, it would instead get a copy of your "/" page.