在 Angularjs 应用程序中使用 google 驱动器 "save to drive" 按钮

Question

我在 angualrjs 项目中使用 google 的 "Save to drive" 按钮时遇到问题。

我可以很好地使用示例代码，但不确定如何将它集成到我的 angularjs 项目中。我的第一次尝试是添加：

<script src="https://apis.google.com/js/platform.js"></script>

在我的 index.html 中（我的 angular 项目的根模板文件）。然后将保存到驱动器 div 添加到子模板：

   <div class="g-savetodrive"
   data-src="data/test.php"
   data-filename="t2.csv"
   data-sitename="My Company Name">
   </div>

不幸的是，我无法让按钮以这种方式呈现。我确定我只是错过了一些基本的 angular 知识，但无法找到我需要知道的具体内容。

Answer 1

如我所料，我只是在 Angular 中错误地使用了 Google API。我能够使用列出的 "Explicit Render" 选项解决我的问题。

所以 index.html:

   <head>
    ...
    <script>
      window.___gcfg = {
        parsetags: 'explicit'
      };
    </script>
    <script src="https://apis.google.com/js/platform.js" async defer></script>
  </head>

并且在模板文件中：

    <a href="javascript:void(0)" id="render-link">Render the Save to Drive button</a>
    <div id="savetodrive-div"></div>

最后，在模板的控制器中：

function renderSaveToDrive() {
          gapi.savetodrive.render('savetodrive-div', {
            src: '/yourFileSource.html',
            filename: 'theTargetfile.txt',
            sitename: 'Your company name'
          });
        }
        document.getElementById('render-link').addEventListener('click', renderSaveToDrive);

注意：您可以只在页面加载时呈现，而不是在单击 "Render to Save to Drive Button" link 时呈现。只是摆脱 <a href="javascript:void(0)" id="render-link">Render the Save to Drive button</a> 在模板中，document.getElementById('render-link').addEventListener('click', renderSaveToDrive); 在控制器中。然后在控制器中直接调用renderSaveToDrive();。

在 Angularjs 应用程序中使用 google 驱动器 "save to drive" 按钮

Using google drive "save to drive" button within Angularjs app

angularjs

google-drive-api