How to get window height in angular js

I 'm using iframe to display the contents using angularjs with ionic framework. Here, I need to give window height as iframe height, so I have used

  $scope.iframeHeight = window.innerHeight;

But, I am getting 1/4th screen only.

Here what I tried so far.

index.html

<!DOCTYPE html>
<html ng-app="ionicApp">
    <head>
    <!-- ionic/angularjs CSS -->
    <link href="css/ionic.css" rel="stylesheet">
    <link href="css/ionic-custom.css" rel="stylesheet">
    <!-- ionic/angularjs js bundle -->
    <script type="text/javascript" src="js/ionic.bundle.js"></script>
    <script>
    angular.module('ionicApp', ['ionic'])
.controller('MainCtrl', function($scope) { 
  $scope.iframeHeight = window.innerHeight;
});
    </script>
    </head>
    <body ng-controller="MainCtrl">
        <iframe src="http://stackoverflow.com" ng-style="{height:iFrameHeight}" id="iframeid" width="100%" ></iframe>   
    </body>
</html>

Am I missing something?

Main problem: you need to add 'px' units to window.innerHeight number. And the second one, variable name is iframeHeight not iFrameHeight. Fixed expression will look like:

ng-style="{height: iframeHeight + 'px'}"

Demo: http://plnkr.co/edit/NdQB5afQT7kMkf27k7wg?p=preview

Since AngularJS contains a small part of jQuery by itself you can use:

// Returns height of browser viewport
$scope.iframeHeight = $(window).height();

or 

// Returns height of HTML document
$scope.iframeHeight = $(document).height();