AngularJS: open new window and maintain two-way data binding
<p>I'm looking to open a new browser window with angular <code>$scope</code> data inside:</p>

<pre><code>&lt;div ng-app="test" ng-controller="testController"&gt;
&lt;input type="text" ng-model="var" /&gt;
    &lt;button ng-click="openWindow()"&gt;push!&lt;/button&gt;
&lt;/div&gt;

var test = angular.module('test', []);

test.controller('testController', ['$compile', '$scope','$window', function($compile, $scope, $window) {
    $scope.var = 'hello'
    $scope.openWindow = function() {
        $scope.window = $window.open('', '_blank', 'width=500,height=400');
        angular.element($scope.window.document.body).append($compile($scope.var)($scope));
    };
}]);
</code></pre>

<p><a href="http://jsfiddle.net/d8atdw0t/55/" rel="nofollow">JSFIDDLE</a></p>

<p>The above doesn't return any data in the window. It works as a directive like <a href="http://blog-softnauts2.rhcloud.com/2014/03/18/building-angular-directive-that-shows-content-in-new-window/" rel="nofollow">in here</a>.</p>

<p>If I <code>append('hello world')</code> it works. Can someone show me how to bind the data correctly without the use of a directive, if that's even possible?</p>