javascript - ディレクティブに渡される変数としての ng-style

Question

私は、ほとんどの人がスタイルを次のように使用していることを知っています:

ng-style="{'background-color': someVariable"}
// or as a variable
ng-style="stage.style"  

計算したばかりのスコープ変数が必要です。

// controller
$scope.stage.style = stageFactory.init(); // returns Object {width: 1155, height: 1304}

私が本当にやりたいことは、それをディレクティブに渡すことです:

app.directive( 'stage', function( $window ){
  return {
    restrict: 'E',
    transclude: true,
    scope: {
      mystyle: '='
    },
    template: '<div ng-style="mystyle" ng-transclude></div>',
    link: function( scope, attr ){
      if( ! scope.mystyle.width ){
        scope.mystyle.width = $window.innerWidth;
      }
      if( ! scope.mystyle.height ){
        scope.mystyle.height = $window.innerHeight;
      }

      // scope.mystyle = {
      //   width: scope.width,
      //   height: scope.height 
      // };

      console.log( 'style in directive', scope.mystyle );
    }
  };
});

コンパイルされているスタイルが表示されないのですが、スタイルを表示するにはどうすればよいですか?

これまでの（不完全な）完全なコード: https://plnkr.co/edit/5wwKJ445IqPGTNGGRDIv?p=preview