Error: Angular is undefined RRS feed

  • Question

  • Hi,

    I am trying to use Angular JS to bind a dropdown from SharePoint custom list.

    I have tried the below code:

    // visual webpart <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.9/angular.min.js"></script> <script src="/_layouts/Test/FillData.js" type="text/javascript"></script> <SharePoint:FormDigest ID="FormDigest1" runat="server"> </SharePoint:FormDigest> <div ng-app="mainApp" ng-controller="mainController"> <form novalidate > <select ng-model="ddlTowers" ng-options="Tower.Name for Tower in Towers track by Tower.Id" required> <option value="">Select</option> </select> //FillData.js var app = angular.module('mainApp', []); app.controller('mainController', function ($scope) { ExecuteOrDelayUntilScriptLoaded(GetData, "sp.js"); $scope.Towers = null; $scope.Towers.items = []; function GetData() { var clientContext = new SP.ClientContext.get_current(); var web = clientContext.get_web(); clientContext.load(web); var list = web.get_lists().getByTitle('Towers'); var query = SP.CamlQuery.createAllItemsQuery(); var listitems = list.getItems(query); clientContext.load(listitems, "Include(Title)"); clientContext.executeQueryAsync(OnSucceeded, onFailed); function OnSucceeded() { $scope.$apply(function () { var itemsCount = listitems.get_count(); for (i = 0; i < itemsCount; i++) { var listitem = listitems.itemAt(i); $scope.Towers.items.push({ "title": listitem.get_fieldValues().Title }); } }); } function onFailed(sender, args) { alert('Error'); } } });

    I am getting error as "Angular is undefined." The control is going to filldata.js file and is breaking in the first line itself.

    How to fix this?


    Wednesday, December 2, 2015 2:11 PM