Open kendo window dynamically from angular

I'm trying to open a kendo window dynamically from angular. By dynamically, I mean adding a <div kendo-window...> to the html from an angular function and then opening the window. The function looks like this

$scope.showCalendar = function() {
   var element = "<div kendo-window='calendar' k-visible='false'> <div kendo-calendar></div> </div>";
   $("#calendarDiv").append(element);
   $scope.calendar.open();
};

The window does not appear. If I include this <div> directly inside the html, then the function call $scope.calendar.open() works okay, of course.

I want to do it this way, because I want to open a varying number of windows (the calendar inside the window is just for experiment; I will replace it with my custom content). This actually leads to another, more general question. I can keep track of unique window identifiers like 'win1', 'win2', and so forth, but how do you the function call dynamic? I need to somehow make this static code $scope.calendar.open() to $scope.win1.open(), $scope.win2.open() and so forth. JavaScript has some kind of eval function? (I'm a JavaScript newbie.)

 Thank you for your help.