Angular does not run on an IIS server after removing the # symbol from the URL

Question

I am developing a web platform using Angular JS as a client side framework and .Net as a Server side framework for creating Rest webservices. Now, my goal is to remove the # symbol. I have followed these steps:

1. Configure $locationProvider and set html5Mode to true .
2. Add the base tag to index.html file ( <base href="/"> ).
3. Configure the iis server for rewrite mode.

After successfully completing these steps, the # is removed from the url and I am able to navigate between routes but Angular does not run correctly (for example: ng-show and ng-disabled directives and my app's controllers are not working).

I have tried to add angular-csp.css to my index.html file and add a ng-csp directive to its body tag but the problem persists.

Is this problem related to a client side configuration (some Angular configs) or a Server side configuration ( iis server configs) and how to solve it?

EDIT

The project runs correctly on my local node http server . I have tested all functionalities locally and no errors in the browser's console.

Answer 1

SO WEIRD! I solved the problem and I don't know how and why. I have tried to place all javascript files in different folders and I ended up with a working app once I placed them in the js folder. Locally, the app works whether all javascript files are located in the js folder or not. But when things get on the iis server, I found that it only works when javascript files are located in the js folder. I have searched a lot for a reason but nothing found.

EDIT:

Finally, I have found the reason why my app works well when I placed Javascript files in the js folder. Actually, it is not about js folder naming specifically, but it is related to a config for accepting only specific folders naming and here is my web.config

<?xml version="1.0" encoding="UTF-8"?>
<configuration>
    <system.webServer>
        <rewrite>
            <rules>
                <rule name="Angular">
                    <match url=".*\.html|css/|img/|fonts/|js/|data/|lib/|templates/|favicon.ico" negate="true" />
                    <action type="Rewrite" url="index.html" />
                </rule>
            </rules>
        </rewrite>

    </system.webServer>
</configuration>

So if I want answer myself: it is an iis server side configuration ( web.config ). At first I putted my javascript files in a folder called " components " which is not listed between the accepted url naming in web.config. As a result, the server wouldn't allow the access to BASE_URL/components and all javascript files in components folder won't be loaded in the browser.