I have the following error when trying to leave only the sum in a column, I want to do it with angularjs > http://jsfiddle.net/m5aptx23/1/ , I attach the case in JSFiddle and the screen capture:

The code:

<script src="https://ajax.aspnetcdn.com/ajax/modernizr/modernizr-2.8.3.js"></script>

<script src="https://code.jquery.com/jquery-1.9.1.min.js"></script>

<script src="https://code.jquery.com/ui/1.10.3/jquery-ui.min.js"></script>

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.7/angular.min.js"></script>

<script src="https://secure-cdn-na.infragistics.com/igniteui/2017.1/latest/js/infragistics.core.js"></script>

<script src="https://secure-cdn-na.infragistics.com/igniteui/2017.1/latest/js/infragistics.lob.js"></script>

<script src="https://secure-cdn-na.infragistics.com/igniteui/2017.1/latest/js/extensions/igniteui-angular.js"></script>

<script src="https://igniteui.github.io/help-samples/data-files/northwindProducts.js"></script>

<script id="colTmpl" type="text/template" ng-non-bindable="">

        {{if ${UnitsInStock} == null }}

        N/A

        {{elseif ${UnitsInStock} >= (Math.random()+0.5)*${UnitsInStock} }}

        $ ${UnitsInStock}

        <img width='10' height='15' src='igniteui.github.io/.../arrowUp.gif' />

        {{else}}

        $ ${UnitsInStock}

        <img width='10' height='15' src='igniteui.github.io/.../arrowDown.gif' />

        {{/if}}

    </script>

<link href="https://secure-cdn-na.infragistics.com/igniteui/2017.1/latest/css/themes/infragistics/infragistics.theme.css" rel="stylesheet">

<link href="https://secure-cdn-na.infragistics.com/igniteui/2017.1/latest/css/structure/infragistics.css" rel="stylesheet">

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

<div ng-app="sampleApp" ng-controller="gridController">

<div class="row">

<div class="col-md-8">

<ig-grid id="grid1" data-source="data" data-source-type="json" width="100%" height="400px" auto-commit="true" auto-generate-columns="false">

<columns>

<column key="ProductName" header-text="Product Name" width="250px" data-type="string"></column>

<column key="ProductID" header-text="ID" width="200px" data-type="number"></column>

</columns>

<features>

<feature name="Summaries">

<column-settings>

<column-setting column-key="ProductName" allow-summaries="false"></column-setting>

<column-setting column-key="ProductID" allow-summaries="true">

<summary-operands row-display-label="Total" type="sum" active="true"></summary-operands>

</column-setting>

</column-settings>

</feature>

</features>

</ig-grid>

</div>

</div>

</div>