How to use AngularJS within Google Apps Script

3
votes

Is it possible to use Angular.js as part of a web app served using HtmlService in Google Apps Script?

I also changed the Code.gs file as mentioned in below link.
How can I use Angular.js in a Google Apps Script served HTML site?

But not getting success.

Source Code :

Code.gs

function doGet(request) {
  return HtmlService.createTemplateFromFile('index')
      .evaluate()
      .setSandboxMode(HtmlService.SandboxMode.IFRAME);
}

function include(filename) {
  return HtmlService.createHtmlOutputFromFile(filename)
      .getContent()
}

index.html

<!DOCTYPE html>
<html ng-app="myApp">
  <head>
    <base target="_top">
  </head>
  <body ng-controller="mainCtrl">
    <h1>{{heading}}</h1>
    <p>{{message}}</p>
    <?!= include('Javascript'); ?>
     <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.js"></script>
  </body>
</html>

Javascript.html

<script>
var app = angular.module('myApp',[]);
app.controller('mainCtrl',function($scope) {
  $scope.heading = 'Welcome';
  $scope.message = 'Please enjoy this helpful script';
});
</script>

Output i am getting in console :

Error while parsing the 'sandbox' attribute: 'allow-modals', 'allow-popups-to-escape-sandbox' are invalid sandbox flags. dev:14
Uncaught ReferenceError: angular is not defined VM4501:2
Uncaught object

Any immediate help will be highly appreciable.

1
angularjsgoogle-apps-script

1 Answers

4
votes

Move the angular.js include script statement into the head section. It needs to be setup before the remaining javascript file is included. It works then. check it here: GAS-angularJS