How to solve this error?


#1

Error in console
For the preference purpose

Error: [$rootScope:infdig] errors.angularjs.org/1.4.3/$rootScope/infdig?p0=10&p1=[[{"ms…22%3A"http%3A%2F%2Fkbs-test.com%2Fimages%2Fpages%2Fimg13.jpg"}]]
at Error (native)
at 127.0.0.1:58889/http-services/emulator-webserver/ripple/userapp/x/C/…-a621-2128fb7dbab1/platforms/ios/www/js/angular/ionic.bundle.min.js:37:416
at n.$digest (127.0.0.1:58889/http-services/emulator-webserver/ripple/userapp/x/C/…-a621-2128fb7dbab1/platforms/ios/www/js/angular/ionic.bundle.min.js:164:96)
at n.$apply (127.0.0.1:58889/http-services/emulator-webserver/ripple/userapp/x/C/…a621-2128fb7dbab1/platforms/ios/www/js/angular/ionic.bundle.min.js:166:269)
at HTMLBodyElement. (127.0.0.1:58889/http-services/emulator-webserver/ripple/userapp/x/C/…a621-2128fb7dbab1/platforms/ios/www/js/angular/ionic.bundle.min.js:137:115)
at HTMLBodyElement.Gf.c (127.0.0.1:58889/http-services/emulator-webserver/ripple/userapp/x/C/…-a621-2128fb7dbab1/platforms/ios/www/js/angular/ionic.bundle.min.js:66:217)
at n (127.0.0.1:58889/http-services/emulator-webserver/ripple/userapp/x/C/…-a621-2128fb7dbab1/platforms/ios/www/js/angular/ionic.bundle.min.js:22:384)
at t (127.0.0.1:58889/http-services/emulator-webserver/ripple/userapp/x/C/…-a621-2128fb7dbab1/platforms/ios/www/js/angular/ionic.bundle.min.js:22:216)
at HTMLDocument.l (127.0.0.1:58889/http-services/emulator-webserver/ripple/userapp/x/C/…a621-2128fb7dbab1/platforms/ios/www/js/angular/ionic.bundle.min.js:22:1451)

HTML Code This is used for display images in grid.
I used this link – http://codepen.io/pulkitsinghal/pen/JjmED/

In this i used 5 ng-repeat tags but i got errors on filter ng-repeat=“row in f.images | inSlicesOf:2”

    <div class="list itemnew card" ng-repeat="group in groups">
                        <ion-item class="item item-icon-right" ng-click="toggleGroup(group)" ng-class="{active: isGroupShown(group)}" style="">
                            <i class="ion-chevron-right pull-right" ng-class="isGroupShown(group) ? 'ion-chevron-down' : 'ion-chevron-right'" style="float:right;"><input type="hidden" ng-model="group.menu_name"></i> &nbsp; {{group.menu_name}}&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                            
                            <div ng-switch on="group.menuid">                          
                                
                                <!--Facilitites-->
                                 <div ng-switch-when="8">
                                    <ion-item class="item-accordion item ng-binding ng-hide " ng-show="isGroupShown(group)" style="">
                                        <div class="item bdr-none blue-light" style="margin-top:25px !important;">
                                            <div ng-repeat="facility in group.facilities">
                                                <div ng-repeat="f in facility">
                                                    <h2 class="padding-left">{{f.facilities_name}}</h2>
                                                    <div class="row" ng-repeat="row in f.images | inSlicesOf:2">
                                                        <div class="col col-50" ng-repeat="item in row">
                                                            <img src="{{item.img_name}}" class="col col-30" ng-click="showImage('{{item.img_name}}')" />
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
    
                                    </ion-item>
                                </div>
    
                                
    
                            </div><!--Switch-->
                        </ion-item>
                    </div>
                    <!-- end ngRepeat: item in group.items -->

Controller
This in controller where i put my filter.

var app = angular.module('test', ['ionic']);
app.filter('inSlicesOf', ['$rootScope',
  function ($rootScope) {
        makeSlices = function (items, count) {
            if (!count)
                count = 3;

            if (!angular.isArray(items) && !angular.isString(items)) return items;

            var array = [];
            for (var i = 0; i < items.length; i++) {
                var chunkIndex = parseInt(i / count, 10);
                var isFirst = (i % count === 0);
                if (isFirst)
                    array[chunkIndex] = [];
                array[chunkIndex].push(items[i]);
            }

            if (angular.equals($rootScope.arrayinSliceOf, array))
                return $rootScope.arrayinSliceOf;
            else
                $rootScope.arrayinSliceOf = array;

            return array;
        };

        return makeSlices;
  }]);
  
  app.controller('AboutUsCtrl', function ($scope, $http, $ionicModal) {
    $scope.groups = [];

    if (window.localStorage.getItem("about") !== null) {
        if (window.localStorage.getItem("about") !== "undefined") {
            $scope.groups = JSON.parse(window.localStorage.getItem("about"));
        }
    }

    $http.post("json")
        .success(function (response) {
            if (response.about === undefined) {
                if (window.localStorage.getItem("about") !== "undefined") {
                    $scope.groups = JSON.parse(window.localStorage.getItem("about"));
                }
            } else {
                $scope.groups = response.about;
                window.localStorage.removeItem("about");
                window.localStorage.setItem("about", JSON.stringify(response.about));
            }

        }).error(function (data) {
            if (window.localStorage.getItem("about") !== "undefined") {
                $scope.groups = JSON.parse(window.localStorage.getItem("about"));
            }
        });

    $scope.toggleGroup = function (group) {
        if ($scope.isGroupShown(group)) {
            $scope.shownGroup = null;
        } else {
            $scope.shownGroup = group;
        }
    };

    $scope.isGroupShown = function (group) {
        return $scope.shownGroup === group;
    };

});