Thursday, April 14, 2016

Get All Lists with REST API and AngularJS

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.1/angular.min.js"></script> 
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.min.js"></script> 
     
<script> 
        var myAngApp = angular.module('SPAngGetLists', []); 
        myAngApp.controller('SPAngGetListsController', function ($scope, $http) { 
            $http({ 
                method: 'GET', 
                url: _spPageContextInfo.webAbsoluteUrl + "/_api/web/Lists?$orderby=Title", 
                headers: { "Accept": "application/json;odata=verbose" } 
            }).success(function (data, status, headers, config) { 
                $scope.customers = data.d.results; 
            }).error(function (data, status, headers, config) { 
           
            }); 
        }); 
</script> 


<div ng-app="SPAngGetLists"> 
    <div ng-controller="SPAngGetListsController" > 
        <table style="width: 100%;"> 
            <tr> 
                <th style="">Id</th> 
                <th style="">Title</th>
                <th style="">Base Template</th>
                <th style="">Base Type</th> 
                <th style="">Created</th>
                <th style="">Hidden</th> 
                <th style="">Item Count</th>
                <th style="">Last Item Deleted</th> 
                <th style="">Last Item Modified</th>
                <th style="">Template FeatureId</th> 
               
            </tr> 
            <tr ng-repeat="customer in customers"> 
                <td >{{customer.Id}}</td> 
                <td>{{customer.Title}}</td> 
                <td>{{customer.BaseTemplate}}</td> 
                <td>{{customer.BaseType}}</td> 
                <td>{{customer.Created |date:'m/d/yyyy'}}</td> 
                <td>{{customer.Hidden}}</td> 
                <td>{{customer.ItemCount}}</td> 
                <td>{{customer.LastItemDeletedDate |date:'m/d/yyyy'}}</td> 
                <td>{{customer.LastItemModifiedDate |date:'m/d/yyyy'}}</td> 
                <td>{{customer.TemplateFeatureId}}</td> 
                </tr> 
        </table> 
    </div> 
</div>