Hide navigation bar with angularjs using ng-if
<p><strong>SOLVED</strong></p>

<p>Good Evening,</p>

<p>I'm having trouble with hiding navigation sidebar using ng-if from angular. I declare the activetab on $route but it still didn't work. Here's the code.</p>

<p>Html:</p>

<pre><code>&lt;header ng-if="$route.current.activetab !== 'login'"&gt;
&lt;div class="col s3"&gt;
    &lt;ul id="nav-mobile" class="side-nav fixed"&gt;
        &lt;li class="logo"&gt;
            &lt;a href="#" id="logo-container" class="brand-logo"&gt;BRAND LOGO&lt;/a&gt;
        &lt;/li&gt;
        &lt;li&gt;Test&lt;/li&gt;
        &lt;li&gt;Test&lt;/li&gt;
        &lt;li&gt;Test&lt;/li&gt;
        &lt;li&gt;Test&lt;/li&gt;
        &lt;li&gt;Test&lt;/li&gt;
    &lt;/ul&gt;
&lt;/div&gt;
</code></pre>

<p></p>

<p>$route config on app.js:</p>

<pre><code>experimentApp.config(['$routeProvider', '$locationProvider', '$httpProvider',
function($routeProvider, $locationProvider, $httpProvider) {
    var baseTitle = 'Experiment';

    $routeProvider.when('/', {
        title: baseTitle + ' - Home',
        templateUrl: 'partials/home.php',
        activetab: 'home'
    }).when('/login', {
        title: baseTitle + ' - Login',
        templateUrl: 'partials/login.php',
        activetab: 'login',
        controller: 'LoginController'
    });

}]);
</code></pre>

<p><strong>Answer</strong>:</p>

<p>i created new controller named navigation, partitioning the html and put some code on root controller.</p>

<p>Navigation Controller:</p>

<pre><code>experimentApp.controller('navigation',
['$scope', '$location', '$route', function($scope, $location, $route) {
    $scope.navigation = function() {
        if (!$scope.active('/login')) {
            return 'partials/navigation.php';
        }
    }
}]);
</code></pre>

<p>$scope.active on root controller:</p>

<pre><code>$scope.active = function(path) {
        return $location.path().match(new RegExp(path + '.*', 'i')) != null;
    }
</code></pre>

<p>HTML:</p>

<pre><code>&lt;header ng-controller="navigation" ng-include="navigation()"&gt;&lt;/header&gt;
</code></pre>

<p>Thanks to anyone who helped.</p>