in controller can't showing content in popup with ng-repeat?

Question

I'm using daypilot scheduler i want to show details of an event in popup when clicked.. how can I get some information of 1 event and set in popup ?

screenshot

$scope.schedulerConfig.onEventClicked = function(args){
   var dp = $scope.scheduler;
   var modal = new DayPilot.Modal({
   onClosed: function(args) {
      if (args.result) {
         loadEvents();
      }
      //else console.log("error");
      dp.clearSelection();
   }  
});
modal.showHtml("<h1>Details</h1><div ng-repeat='event in events' ng-
               if='event.id == 1490'><div >{{ event.id }}</div><div >{{ event.text }}</div>
               <div >{{ event.start }}</div> <div >{{ event.end }}</div><div >{{ event.resource }}</div></div>");
}

Answer 1

The HTML you display in the modal dialog is never compiled by Angular. Thus nothing is rendered but the plain text that you provided. You need to let Angular compile the template first using the proper scope. After that you can display the compiled HTML. See the Angular docs for more information on $compile

Update:

Try this code

var html = "<h1>Details</h1> ...";
var modalTemplateCompiler = $compile(html)
var modalContent = modalTemplateCompiler($scope)
$scope.$digest()
modal.showHtml(modalContent[0])

This code is untested. You also need to inject $compile into your controller. Furthermore, this could lead to a Digest Error. In that case, you have to create a new scope and extend it by all the properties you need.

var modalScope = $scope.$new()
// Use Lodash library here to extend the new scope
_.extend(modalScope, $scope)
var html = "<h1>Details</h1> ...";
var modalTemplateCompiler = $compile(html)
var modalContent = modalTemplateCompiler(modalScope)
modalScope.$digest()
modal.showHtml(modalContent[0])

What this code does is it creates a new scope, extends it by the properties you need to compile your template. Then it generates a compile function from the HTML you provided. It returns a function that we can pass the scope to. The HTML is then compiled with the provided scope. In the last step the digest is triggered and the template is ready for displaying.

I would always recommend using a directive over this version, but I have no idea about the DayPilot library though.