AngularJS html5Mode rewrite rules with local API support

.htaccess

<IfModule mod_rewrite.c>
RewriteEngine On

# API Rules
RewriteRule ^api/(.*)\.php$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^api/(.*)$ api/$1.php [QSA,L]

# AngularJS Rules
RewriteRule ^index\.html$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^(.*)$ index.html [QSA,L]
</IfModule>

web.config

<?xml version="1.0" encoding="UTF-8"?>
<configuration>
    <system.webServer>
        <rewrite>
            <rules>
            	<!-- API Rules -->
            	<rule name="API Rule 1" stopProcessing="true">
                    <match url="^api/(.*)\.php$" ignoreCase="false" />
                    <action type="None" />
                </rule>
                <rule name="API Rule 2" stopProcessing="true">
                    <match url="^" ignoreCase="false" />
                    <conditions logicalGrouping="MatchAny">
                        <add input="{REQUEST_FILENAME}" matchType="IsFile" ignoreCase="false" />
                        <add input="{REQUEST_FILENAME}" matchType="IsDirectory" ignoreCase="false" />
                    </conditions>
                    <action type="None" />
                </rule>
                <rule name="API Rule 3" stopProcessing="true">
                    <match url="^api/(.*)$" ignoreCase="false" />
                    <action type="Rewrite" url="api/$1.php" />
                </rule>                
                
                <!-- AngularJS Rules -->
                <rule name="AngularJS Rule 1" stopProcessing="true">
                    <match url="^index\.html$" ignoreCase="false" />
                    <action type="None" />
                </rule>
                <rule name="AngularJS Rule 2" stopProcessing="true">
                    <match url="^" ignoreCase="false" />
                    <conditions logicalGrouping="MatchAny">
                        <add input="{REQUEST_FILENAME}" matchType="IsFile" ignoreCase="false" />
                        <add input="{REQUEST_FILENAME}" matchType="IsDirectory" ignoreCase="false" />
                    </conditions>
                    <action type="None" />
                </rule>
                <rule name="AngularJS Rule 3" stopProcessing="true">
                    <match url="^(.*)$" ignoreCase="false" />
                    <action type="Rewrite" url="index.html" />
                </rule>
            </rules>
        </rewrite>
    </system.webServer>
</configuration>

THANK YOU. For posting this. I've been trying like hell to get both my API and my Angular app to play nice along side one another :)

I have been trying to use the rewrite rule buy it won't work