0

我正在尝试将 Excel Web App 添加到 DurandalJS 网站。基本上，我从服务器获取一个 JSON 对象，将其转换为<table>...</table>标签，以便 Excel Web App 可以理解它。然后我希望能够使用 Excel Web App 查看该表（调整列大小、选择、排序、过滤等）。

首先，我正在尝试最简单的解决方案 - 硬编码![<table />][1]：

  1. 创建了一个新的 DurandalJS 项目（使用他们网站上的模板）
  2. welcome.html用我在ExcelMashup.com上找到的以下代码替换了 的内容：

<a href="#" name="MicrosoftExcelButton" data-xl-tableTitle="My Title" data-xl-buttonStyle="Standard" data-xl-fileName="Book1" data-xl-attribution="Data provided by MY Company" ></a>

<table> ... </table>

<script type="text/javascript" src="https://r.office.microsoft.com/r/rlidExcelButton?v=1&kip=1"></script>

但 Durandal 只会显示表格数据，而忽略 Excel 按钮。当我尝试将最后一行 ( <script/>) 移动到index.cshtml.

这就是它在 Durandal 上的样子

有什么想法可以让我有类似 Excel 的行为来查看 Durandal 下的表格吗？

谢谢！

PS：我真正的项目是在 Durandal 1.2 上工作，但目前我会采取任何解决方案，甚至是 Durandal 2.0。

4

2 回答 2

0

Durandal 不支持单个视图文件 (.html) 中的多个根。您需要将您的<a>标签和您的<table>标签包装在一个<div>标签、<section>标签或更高级别的东西中。

此外，正如您所说，您必须将<script>标签移动到 index.cshtml。

最后，使用您正在使用的浏览器的开发工具来确保 ExcelButton 资源正在实际加载。

于 2014-03-20T05:46:23.507 回答
0

Durandal 不会在视图中呈现脚本标签。要渲染它们，您应该使用淘汰赛自定义绑定：

ko.bindingHandlers.excelScript = {
  update: function( element, valueAccessor, allBindingsAccessor, viewModel, bindingContext){
    $(element).html('<script type="text/javascript" src="https://r.office.microsoft.com/r/rlidExcelButton?v=1&kip=1"></script>');
  }
};

在您的视图中使用它：

<div data-bind="excelScript"></div>
于 2014-03-20T16:27:39.547 回答