Having trouble displaying my bottom div.
I've tried all the tips and tricks from Stack Overflow this year. Added a variable to $scope, attempted $scope.apply(); , etc.
<nav class="navbar navbar-default navbar-fixed-top" role="navigation" ng-controller="navController">
<div class="navbar-header" >
<button type="button" class="navbar-toggle pull-left" data-toggle="collapse" data-target=".navbar-collapse" ng-click="navCollapse()">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="/#!/">Example</a>
</div>
<div class="cart-summary">
<a href="/#!/cart">
<img src="/example/source" />
<div class="cart-info">
<div class="item-count"><p>{{ ngCart.getTotalItems() }} <ng-pluralize count="ngCart.getTotalItems()" when="{1: 'item', 'other':'items'}"></ng-pluralize><p></div>
<div class="total-cost"><p>{{ ngCart.totalCost() | currency }}<p></div>
</div>
</a>
</div>
</nav>
<div ng-show="vm.open" class="half-menu" id="side-menu" >
<ul>
<li><button><a href="/#!/cart">Cart</a></button></li>
</ul>
</div>
Here's what I have in my navController:
console.log('navController running!');
$scope.vm = { open: false};
$scope.navCollapse = function(){
console.log('before click', $scope.vm.open);
$scope.vm.open = !$scope.vm.open;
//open up menu
console.log('after click', $scope.vm.open);
};
The console log indicates that the controller is loaded properly.