title: Yii2 + AngularJS PrettyURL enable to work
body: <p>I'm using Yii2 with AngularJS. I have to call different pages like about us, contact us etc. But my Pretty URL not working Properly. I need PrettyUrl like this: </p>
  
  <p><code>localhost/angularjsyii/frontend/web/site/#/login</code></p>
  
  <p>Current Url which is not working: <code>localhost/angularjsyii/frontend/web/site#!/#%2Flogin</code></p>
  
  <h3>.htaccess</h3>
  
  <pre><code>RewriteEngine on
  # If a directory or a file exists, use it directly
  RewriteCond %{REQUEST_FILENAME} !-f
  RewriteCond %{REQUEST_FILENAME} !-d
  # Otherwise forward it to index.php
  RewriteRule . index.php
  </code></pre>
  
  <h3>main.php(<code>&lt;navbar&gt;</code>)</h3>
  
  <pre><code>   &lt;?php
  use frontend\assets\AppAsset;
  
  /* @var $this \yii\web\View */
  
  AppAsset::register($this);
  ?&gt;
  &lt;?php $this-&gt;beginPage() ?&gt;
  &lt;!DOCTYPE html&gt;
  &lt;html lang="&lt;?= Yii::$app-&gt;language ?&gt;" ng-app="app"&gt;
  &lt;head&gt;
  &lt;meta charset="&lt;?= Yii::$app-&gt;charset ?&gt;"&gt;
  &lt;meta name="viewport" content="width=device-width, initial-scale=1"&gt;
  &lt;title&gt;My Angular Yii Application&lt;/title&gt;
  &lt;?php $this-&gt;head() ?&gt;
  
  &lt;script&gt;paceOptions = {ajax: {trackMethods: ['GET', 'POST']}};&lt;/script&gt;
  &lt;script src="https://cdnjs.cloudflare.com/ajax/libs/pace/1.0.2/pace.js"&gt;&lt;/script&gt;
  &lt;link href="https://cdnjs.cloudflare.com/ajax/libs/pace/1.0.2/themes/red/pace-theme-minimal.css" rel="stylesheet" /&gt;
  &lt;a base href="/angularjsyii/frontend/web/"&gt;&lt;/a&gt;
  &lt;/head&gt;
  &lt;body&gt;
  &lt;?php $this-&gt;beginBody() ?&gt;
  &lt;div class="wrap"&gt;
      &lt;nav class="navbar-inverse navbar-fixed-top navbar" role="navigation" bs-navbar&gt;
          &lt;div class="container"&gt;
              &lt;div class="navbar-header"&gt;
                  &lt;button ng-init="navCollapsed = true" ng-click="navCollapsed = !navCollapsed" type="button" class="navbar-toggle"&gt;
                      &lt;span class="sr-only"&gt;Toggle navigation&lt;/span&gt;
                      &lt;span class="icon-bar"&gt;&lt;/span&gt;
                      &lt;span class="icon-bar"&gt;&lt;/span&gt;
                      &lt;span class="icon-bar"&gt;&lt;/span&gt;&lt;/button&gt;
                  &lt;a class="navbar-brand" href="/angularjsyii/frontend/web/site/index"&gt;My Company&lt;/a&gt;
              &lt;/div&gt;
              &lt;div ng-class="!navCollapsed &amp;&amp; 'in'" ng-click="navCollapsed=true" class="collapse navbar-collapse" &gt;
                  &lt;ul class="navbar-nav navbar-right nav"&gt;
                      &lt;li data-match-route="/"&gt;
                          &lt;a href="/"&gt;Home&lt;/a&gt;
                      &lt;/li&gt;
                      &lt;li data-match-route="/about"&gt;
                          &lt;a href="/about"&gt;About&lt;/a&gt;
                      &lt;/li&gt;
                      &lt;li data-match-route="/contact"&gt;
                          &lt;a href="/contact"&gt;Contact&lt;/a&gt;
                      &lt;/li&gt;
                      &lt;li data-match-route="/login"&gt;
                          &lt;a href="/login"&gt;Login&lt;/a&gt;
                      &lt;/li&gt;
                  &lt;/ul&gt;
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/nav&gt;
  
      &lt;div class="container"&gt;
          &lt;div ng-view&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  
  &lt;/div&gt;
  
  &lt;footer class="footer"&gt;
      &lt;div class="container"&gt;
  
          &lt;p class="pull-right"&gt;&lt;?= Yii::powered() ?&gt; &lt;?= Yii::getVersion() ?&gt;&lt;/p&gt;
      &lt;/div&gt;
  &lt;/footer&gt;
  
  &lt;?php $this-&gt;endBody() ?&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  &lt;?php $this-&gt;endPage() ?&gt;
  </code></pre>
  
  <h3>app.js (For routing)</h3>
  
  <pre><code>    'use strict';
  
      var app = angular.module('app', [
          'ngRoute',      //$routeProvider
          'mgcrea.ngStrap'//bs-navbar, data-match-route directives
      ]);
  
      app.config(['$routeProvider',
          function($routeProvider) {
              $routeProvider.
                  when('/', {
                      templateUrl: 'partials/index.html'
                  }).
                  when('/about', {
                      templateUrl: 'partials/about.html'
                  }).
                  when('/contact', {
                      templateUrl: 'partials/contact.html'
                  }).
                  when('/login', {
                      templateUrl: 'partials/login.html'
                  }).
                  otherwise({
                      templateUrl: 'partials/404.html'
                  });
          }
      ])
  
  ;
  </code></pre>
  
  <h3>config/main.php</h3>
  
  <pre><code>'urlManager' =&gt; [
      'class' =&gt; 'yii\web\UrlManager',
      // Disable index.php
      'showScriptName' =&gt; false,
      // Disable r= routes
      'enablePrettyUrl' =&gt; true,
  ],
  </code></pre>