0

我正在使用 daypilot 调度程序，我想在单击时在弹出窗口中显示事件的详细信息。如何获取 1 个事件的一些信息并在弹出窗口中设置？

截屏 

$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>");
}

4

1 回答 1

1

您在模态对话框中显示的 HTML 永远不会被 Angular 编译。因此，除了您提供的纯文本之外，什么都不会呈现。您需要先让 Angular 使用适当的范围编译模板。之后，您可以显示编译后的 HTML。有关$compile的更多信息，请参阅 Angular 文档

更新：

试试这个代码

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

此代码未经测试。您还需要注入$compile您的控制器。此外，这可能导致摘要错误。在这种情况下，您必须创建一个新范围并通过您需要的所有属性对其进行扩展。

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])

这段代码的作用是创建一个新范围，通过编译模板所需的属性对其进行扩展。然后它会根据您提供的 HTML 生成一个编译函数。它返回一个我们可以将作用域传递给的函数。然后使用提供的范围编译 HTML。在最后一步中，摘要被触发，模板已准备好显示。

我总是建议在这个版本上使用指令，但我不知道 DayPilot 库。

于 2017-02-23T11:25:42.240 回答