html - 使用 angularjs 将 html 表导出到 Google 电子表格

Question

我创建了一个使用 AngularJS 和 Node.js 管理库存的应用程序。 现在我想向特定屏幕添加导出功能。 我宁愿将数据导出到新的 Google 电子表格(而不是 Microsoft Excel)，但我找不到这样做的方法...

我已经将我的数据转换为一个简单的 html 表格，并且我已经成功下载了它的 xls 文件，但它有很多问题(编码、在单元格中显示图像等)，所以我真的宁愿将其导出到Google 电子表格。

有人知道将 html 表格导出到 Google 电子表格的简单方法吗？我不相信这是不可能的......

谢谢

Answer 1

最后，我针对这个问题找到了一个简单(而且实际上非常有效)的解决方案。

我使用 ZeroClipboard 将表格复制到用户的剪贴板中，然后打开一个新的 Google 电子表格。用户所需要做的就是单击 Ctrl-V 并粘贴表格。

这是代码:

HTML

<a ng-repeat="exportBtn in exportTables" class="btn btn-default" href="" clip-copy="getHtmlToCopy(exportBtn.target)" clip-copy-mime-type="text/plain">Copy {{exportBtn.name}} </a>

打开一个新的 Google 电子表格

JS

 $rootScope.getHtmlToCopy = function (target) {
        var copyConst = {rowSeperator: "\r\n", colSeperator: "\t"}

        function $chk(obj) {
          return !!(obj || obj === 0)
        }

        var TableUtil = {
          nodeToString: function (table, rowSeperator, colSeperator) {
            var d = "";
            if (table.childNodes.length) {
              if ("TD" == table.nodeName || "TH" == table.nodeName)colSeperator = rowSeperator = "";
              for (table = table.firstChild; table;) {
                d += TableUtil.nodeToString(table, rowSeperator, colSeperator);
                if ("TR" == table.nodeName)d += rowSeperator; else if ("TD" == table.nodeName || "TH" == table.nodeName)d += colSeperator;
                table = table.nextSibling
              }
            } else"#text" == table.nodeName && $chk(table.nodeValue) && "" !== table.nodeValue && (rowSeperator = table.nodeValue, colSeperator = RegExp("\\t", "g"), rowSeperator = rowSeperator.replace(RegExp("\\n", "g"), ""), rowSeperator = rowSeperator.replace(colSeperator, ""), d += rowSeperator.trim());
            return d
          }
        }

        var res = TableUtil.nodeToString($('table#' + target)[0], copyConst.rowSeperator, copyConst.colSeperator)

        console.log('got html to copy', res);

        //the following line might cause a popup blocker to stop the new tab. you can show a button after the copy is finished that will open a new tab
        window.open("http://spreadsheets.google.com/ccc?new");

        return (res);
      }

它很丑，但工作得很好!