Restangular JSON vs. JSON as object - Using $filter in the controller doesnt work with the restangularized

Question

I have a problem with using Restangular.

In my Controller i read in a JSON file and display it with ng-repeat. I do some prefiltering using $filter to display only certain results.

However i tried a demo app, which uses Restangular to fetch the JSON from a json file. Displaying the whole JSON without using $filter works. But when applying the $filter i get no results. It seems like Restangular modifies my JSON so my filter won't work. This may be solution but i have no idea where to place it in my Restangular Setup. I'm quite a newbie so be kind with me ;) https://github.com/mgonto/restangular/tree/master#how-can-i-access-the-unrestangularized-element-as-well-as-the-restangularized-one

My code is as follows:

 myApp.controller('IndexCtrl', function ($scope, $filter, myRestangular) {

// Helper function for opening new webviews


  // Fetch all objects from the local JSON (see app/models/model.js)
  $scope.items = myRestangular.all('item').getList();


 // Same JSON Object
    //   $scope.items = [
    //   {
    //     "app_id": 1,
    //     "place": "Canada",
    //     "name": " Toronto",
    //     "age": " 1",
    //     "description": "Just testing."
    //   },
         ......//other data
    // ];

  // MY Filter to display all entries with place Canada, works with JSON embeded into   the script, but not with the restangular one 

   $scope.items = $filter("filter")($scope.items, {place: "Canada"});


});

Model

var module = angular.module('AppModel', ['restangular']);

module.factory('myRestangular', function(Restangular) {

  return Restangular.withConfig(function(RestangularConfigurer) {

    RestangularConfigurer.setBaseUrl('http://localhost/data');
    RestangularConfigurer.setRequestSuffix('.json');

    RestangularConfigurer.setRestangularFields({
      id: "app_id"

    });

  });


});

To get a single element this works also.

// Fetch all objects from the local JSON (see app/models/model.js)
  myRestangular.all('item').getList().then( function(items) {
    // Then select the one based on the view's id query parameter
    $scope.item = $filter('filter')(items, {app_id: 1})[0];

  });

Answer 1

I'm not a Restangular user, but since AJAX calls are asynchronous there's nothing to filter yet when you call $scope.items = $filter("filter").

You've noticed that it works with .then( function(items) { because you've got a response by then.