1

I am trying to figure out how to get the expanded property data and be able to use that data in my angular code.

REST call to get expanded property Data:

/_api/Web/GetFolderByServerRelativeUrl('Pages/KB')/Files?$expand=ListItemAllFields

Associated XML data

<m:properties>
                    <d:FileSystemObjectType m:type="Edm.Int32">0</d:FileSystemObjectType>
                    <d:Id m:type="Edm.Int32">13</d:Id>
                    <d:ContentTypeId>0x010100C568DB</d:ContentTypeId>
                    <d:Title>Test 2</d:Title>
                    <d:Comments m:null="true" />
                    <d:PublishingContactId m:type="Edm.Int32">10</d:PublishingContactId>
                    <d:PublishingContactEmail m:null="true" />
                    <d:PublishingContactName m:null="true" />
                    <d:PublishingContactPicture m:null="true" />
                    <d:PublishingPageLayout m:type="SP.FieldUrlValue">
                        <d:Description>Article Layout</d:Description>
                        <d:Url>/masterpage/ArticleLayout.aspx</d:Url>
                    </d:PublishingPageLayout>
                    <d:PublishingIsFurlPage m:type="Edm.Boolean">false</d:PublishingIsFurlPage>
                    <d:SeoBrowserTitle m:null="true" />
                    <d:SeoMetaDescription m:null="true" />
                    <d:SeoKeywords m:null="true" />
                    <d:RobotsNoIndex m:type="Edm.Boolean">false</d:RobotsNoIndex>
                    <d:PublishingPageContent>&lt;p&gt;????????????&lt;br&gt;&lt;/p&gt;</d:PublishingPageContent>
                    <d:ArticleByLine m:null="true" />
                    <d:ArticleStartDate m:null="true" />
                    <d:PublishingImageCaption m:null="true" />
                    <d:Hints m:null="true" />
                    <d:Operational_x0020_Role m:type="Collection(Edm.String)">
                        <d:element>Financial Management</d:element>
                    </d:Operational_x0020_Role>
                    <d:Modules>General Accounting</d:Modules>
                    <d:Procedure_x0020_ID m:null="true" />
                    <d:ID m:type="Edm.Int32">13</d:ID>
                    <d:Created m:type="Edm.DateTime">2016-08-25T15:32:52</d:Created>
                    <d:AuthorId m:type="Edm.Int32">10</d:AuthorId>
                    <d:Modified m:type="Edm.DateTime">2016-10-03T10:43:58</d:Modified>
                    <d:EditorId m:type="Edm.Int32">9</d:EditorId>
                    <d:OData__CopySource m:null="true" />
                    <d:CheckoutUserId m:null="true" />
                    <d:OData__UIVersionString>3.0</d:OData__UIVersionString>
                    <d:GUID m:type="Edm.Guid">ff929745-eb90-496f-80c4-011012e9f01b</d:GUID>
</m:properties>

When the angular code below runs the module portion is showing undefined although there is an associated tag in the expanded data properties.

<!DOCTYPE html>
<html>
<head>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
    <script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.12.4.min.js"></script>
    <script src="https://cdn.jsdelivr.net/lodash/4.16.2/lodash.min.js"></script>

    <script type="text/javascript">
        var moduleServiceUrl = _spPageContextInfo.webAbsoluteUrl + "/_api/Web/GetFolderByServerRelativeUrl('Pages/KB')/Files?$expand=ListItemAllFields";
        var appVar = angular.module('listApp', []);

        appVar.controller('controller1', ['$scope', '$http', function controller1($scope, $http) {
            $http({
                method: 'GET',
                url: moduleServiceUrl,
                headers: { "Accept": "application/json;odata=verbose" }
            }).success(function (data, status, headers, config) {
                $scope.items = data.d.results;
                $scope.modules = _.groupBy(data.d.results, 'Modules');
            });
        }])
    </script>
</head>

<body>
    <hr />
    <div ng-app="listApp" class="ng-app" id="ng-app">
        <div id="App1" ng-controller="controller1">
            <div ng-repeat="(module, items) in modules">
                <p><strong>{{module}}</strong></p>
                <p ng-repeat="item in items" style="padding-left:10px;">
                    <a ng-href="{{item.ServerRelativeUrl}}">{{item.Title}}</a>
                </p>
            </div>
        </div>
    </div>
</body>
</html>
0

Endpoint:

/_api/Web/GetFolderByServerRelativeUrl('Pages/KB')/Files?$expand=ListItemAllFields

returns SP.FileCollection resource but Modules property belongs to SP.ListItem resource, that is the reason why Lodash groupBy returns undefined.

Solution

Replace the line:

$scope.modules = _.groupBy(data.d.results, 'Modules');

with

$scope.modules = _.groupBy(data.d.results, 'ListItemAllFields.Modules');

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.