KendoWindow AngularJS：未显示转置的元素

下面的代码将KendoWindow封装在指令中。目标有两个：1通过$broadcast打开/关闭KendoWindow，避免在控制器中使用窗口打开/关闭方法，因为这些方法修改DOM而不是模型；2使用转换在组件子元素中定义将在KendoWindow中显示并在控制器中处理的元素

问题是这些元素没有显示在KendoWindow中，drow下拉列表也不起作用。这个代码怎么了

HTML:

Javascript:

 var app = angular.module("app", [ "kendo.directives" ]);

 function MyCtrl($scope) {

     $scope.open = function () {
         $scope.$broadcast('open');
     };


    $scope.close = function () {
         $scope.$broadcast('close');
    };


    $scope.ddlOptions =  {

      select: function() {
        alert('selected');
      }
    }; 
}

app.directive('myWindow', function() {

    var directive = {};

    directive.restrict = 'AE';

    directive.transclude = true;

    directive.scope = { title: '=' };

    directive.template = '<div kendo-window="win" k-width="500" k-visible="false" ng-transclude></div>';

    directive.link = function(scope, element, attrs) {


        var init = function() {
            scope.win.title(scope.title);
         };


        scope.$on("open", function(){
            scope.win.center();
            scope.win.open();
        });


       scope.$on("close", function(){
           scope.win.close();
       });


    scope.$on("kendoWidgetCreated", function(event, widget){

        if (widget === scope.win ) {
            init();
        }

    });


 };


 return directive;

});

 var app = angular.module("app", [ "kendo.directives" ]);

 function MyCtrl($scope) {

     $scope.open = function () {
         $scope.$broadcast('open');
     };


    $scope.close = function () {
         $scope.$broadcast('close');
    };


    $scope.ddlOptions =  {

      select: function() {
        alert('selected');
      }
    }; 
}

app.directive('myWindow', function() {

    var directive = {};

    directive.restrict = 'AE';

    directive.transclude = true;

    directive.scope = { title: '=' };

    directive.template = '<div kendo-window="win" k-width="500" k-visible="false" ng-transclude></div>';

    directive.link = function(scope, element, attrs) {


        var init = function() {
            scope.win.title(scope.title);
         };


        scope.$on("open", function(){
            scope.win.center();
            scope.win.open();
        });


       scope.$on("close", function(){
           scope.win.close();
       });


    scope.$on("kendoWidgetCreated", function(event, widget){

        if (widget === scope.win ) {
            init();
        }

    });


 };


 return directive;

});