Ng-style in ion-nav-view not getting value from controller


#1

I am making a hybrid app using ionic and have encountered the following problem. I have tried

<div ng-if="hasInfo" style="height:40px;">Info</div>

<ion-nav-view ng-style="{height: winHeight}"></ion-nav-view>

but ion-nav-view does not get a value from my controller

if (!angular.isArray(data)) {
    $scope.hasInfo = true;
    $scope.winHeight = ($window.innerHeight - 40) + 'px !important';
} else {
    $scope.hasInfo = false;
    $scope.winHeight = ($window.innerHeight) + 'px !important';
}

console.log($scope.winHeight);

console.log give me the correct text, but when I load and inspect the element, everything I see is

<ion-nav-view ng-style="winHeight" class="view-container" nav-view-transition="ios" nav-view-direction="none" nav-swipe="">

When I instead write

<ion-nav-view style="height:528px !important;"></ion-nav-view>

(for a window height originally 568px) it works like I want, but then it’s not dynamic. Anyone know what I did wrong?


#2

!important don’t work in ng-style.
if you need to use it in your app, here is some workaround solutions here: http://stackoverflow.com/questions/22046704/can-i-use-the-important-css-keyword-with-angularjs-ng-style-directive