3

I have several dynamic pages that follow a simple query string pattern: 

"...com/directory/my-post-title?id=#"

where hash is a digit defined in a JSON file, assigned at creation.

There are no issue with routing etc, and I have successfully been able to use this with ng-repeat to retrieve data when the exact match comparator is not present, but for some reason it does not work as expected when applied.

In the following setup, I am using a function within my filter to pull the query string from the url, which is then used to set the filter. Any reason why this isn't working?

Template:

<div data-ng-repeat="item in items | filter:{itemID:queryID}:true | limitTo:'1'">
   {{::item.name}}
</div>

Controller:

angular.module('myApp').controller('mainCtrl', ['$rootScope', '$scope', '$location', function($rootScope, $scope, $location) {
   $rootScope.$on('$routeChangeSuccess', function(event, current, previous) {
      $scope.queryID = $location.search().id;
   });
}]);

JSON:

{
"myItems": [
    {
      "itemID": 1,
      "name": "some name"
   },
   {
      "itemID": 11,
      "name": "another name"
   }
]
}
dustintheweb
  • 247
  • 1
  • 13
  • First off, why aren't you filtering from server in the first place ? Second, seems to work here - http://jsfiddle.net/HB7LU/13425/ Do you have any errors in console ? – Omri Aharon May 04 '15 at 14:57
  • bad idea using a function rather than a static variable and not very efficient – charlietfl May 04 '15 at 15:08
  • Thanks @OmriAharon, no errors on my end. Your fiddle seems to work because you are returning a static value - just verified in my app as well. The issue seems to be in the pulling of the query, and "when" it is actually pushed into the object. Re server filtering, at the moment the app I am deving has no backend, only a JSON file with dummy data. Eventually it will have Rails w/ webhooks, so everything will be spit into the JSON eventually. If there is a better way to structure, would love to hear your ideas. – dustintheweb May 04 '15 at 15:09
  • @charlietfl what would your ideas be for better efficiency in this use case? – dustintheweb May 04 '15 at 15:10
  • 1
    Can use routeChange events to update a variable in the controller or see this watch concept http://stackoverflow.com/questions/14867772/angularjs-search-change-event – charlietfl May 04 '15 at 15:12
  • @charlietfl def more optimal (updated my code above). Still not able to get that comparator to work though :/ – dustintheweb May 04 '15 at 15:28
  • Well, not much changed but if I return a variable it works http://jsfiddle.net/HB7LU/13428/ So maybe you can set up a variable on the controller's initialisation and return that? – Omri Aharon May 04 '15 at 15:43
  • @OmriAharon was thinking same thing since search change should create new instance of controller each time – charlietfl May 04 '15 at 15:45
  • Just figured it out. The last piece of the puzzle was that $location.search().id comes through as a string. Added a simple parseInt() to that var & now I'm in business. If one of you wants to post a wrap up answer, I'll award. – dustintheweb May 04 '15 at 15:51

0 Answers0