无法让AngularJS在Google电子表格边栏中工作

时间:2016-05-12 18:24:32

标签: javascript html angularjs google-apps-script sidebar

我正在使用Google电子表格从表单中获取数据(在本例中为Google工作表侧边栏)并将数据发送回我的电子表格以填充表格。我希望在我的表单中有可变数量的字段,并且我已经使用AngularJS创建了一个HTML文件来执行此操作。以下是我的档案。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Objectives</title>


    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular.js"></script>


    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/1.3.2/ui-bootstrap-tpls.min.js"></script>


    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">

    <link rel="stylesheet" href="master.css">

    <script>
        var myApp = angular.module('myApp');

        myApp.controller('cerebroController', function ($scope, $http) {
            $scope.objectives = 5;
            $scope.keyResults = 2;
            $scope.getNumber = function (n) {
                console.log(n);
                var retArr = [];
                for (var i = 0; i < n; i++) {
                    retArr[i] = i;
                }
                return retArr;
            }
        });
    </script>
    <script src="sheetUpdate.gs"></script>
</head>
<body ng-App="myApp">
<div ng-controller="cerebroController" class="main">
    <select name="numObjs" ng-model="objectives">
        <option ng-repeat="i in getNumber(10)" value="{{$index+1}}">{{$index+1}}</option>
    </select>
    <ul ng-repeat="i in getNumber(objectives)">
        <h3>Objective {{$index+1}} Name</h3>
        <input type="text" value="" class="keys">
        <select name="numObjs" ng-model="keyResults">
            <option ng-repeat="i in getNumber(10)" value="{{$index+1}}">{{$index+1}}</option>
        </select>
        <div class="clearfix"></div>
        <ul ng-repeat="i in getNumber(keyResults)">
            <br>
            <p>Key Result {{$index + 1}}</p>
            <input id="route" type="text" value="" class="form-control">
        </ul>
    </ul>
</div>
</body>
</html>

以下是我在GS中创建侧边栏的方法:

function showSidebar()
{

  var htm = HtmlService.createHtmlOutputFromFile('cerebro.html').setTitle('Generate Lines').setWidth(300);
  htm.setSandboxMode(HtmlService.SandboxMode.IFRAME);

  ui.showSidebar(htm);

};

但是当我加载侧边栏时,字段不是动态生成的,而且我有Angular的双花括号,会打印文字字符串,例如&#34; {{$ index + 1}}&#34 ;。有谁知道我如何让Angular与我的侧边栏一起工作?

0 个答案:

没有答案