I am developing a news app using Ionic. News is coming from a wordpress site in json format. Here is a small chunk of the json.

{
"status": "ok",
"count": 100,
"count_total": 4104,
"pages": 42,
"posts": [
    {
        "id": 57063,
        "type": "post",
        "slug": "%e0%a6%b6%e0%a6%bf%e0%a6%ac%e0%a6%bf%e0%a6%b0%e0%a7%87%e0%a6%b0-%e0%a6%95%e0%a7%87%e0%a6%a8%e0%a7%8d%e0%a6%a6%e0%a7%8d%e0%a6%b0%e0%a7%80%e0%a7%9f-%e0%a6%a8%e0%a7%87%e0%a6%a4%e0%a6%be-%e0%a6%8f",
        "url": "http://latestkhobor.com/%e0%a6%b8%e0%a6%be%e0%a6%b0%e0%a6%be%e0%a6%a6%e0%a7%87%e0%a6%b6/%e0%a6%9a%e0%a6%9f%e0%a7%8d%e0%a6%9f%e0%a6%97%e0%a7%8d%e0%a6%b0%e0%a6%be%e0%a6%ae-%e0%a6%ac%e0%a6%bf%e0%a6%ad%e0%a6%be%e0%a6%97/%e0%a6%b6%e0%a6%bf%e0%a6%ac%e0%a6%bf%e0%a6%b0%e0%a7%87%e0%a6%b0-%e0%a6%95%e0%a7%87%e0%a6%a8%e0%a7%8d%e0%a6%a6%e0%a7%8d%e0%a6%b0%e0%a7%80%e0%a7%9f-%e0%a6%a8%e0%a7%87%e0%a6%a4%e0%a6%be-%e0%a6%8f/",
        "status": "publish",
        "title": "শিবিরের কেন্দ্রীয় নেতা এনামুল চট্টগ্রামে গ্রেফতার",
        "title_plain": "শিবিরের কেন্দ্রীয় নেতা এনামুল চট্টগ্রামে গ্রেফতার",
        "content": "<p style=\"text-align: justify;\"><a href=\"http://latestkhobor.com/wp-content/uploads/2015/02/enamul_224231.jpg\"><img class=\"alignleft size-thumbnail wp-image-57037\" src=\"http://latestkhobor.com/wp-content/uploads/2015/02/enamul_224231-150x150.jpg\" alt=\"enamul_224231.jpg\" width=\"150\" height=\"150\" /></a>নাশকতার অভিযোগে ছাত্রশিবিরের কেন্দ্রীয় কার্যকরী পরিষদের সদস্য এনামুল কবিরকে গ্রেফতার করেছে চট্টগ্রাম মহানগর পুলিশ। শুক্রবার তাকে নগরীর বাকলিয়া থানার বগার বিল এলাকা থেকে গ্রেফতার করে পুলিশ।</p>\n<p style=\"text-align: justify;\">নগর পুলিশের অতিরিক্ত কমিশনার (অপরাধ ও অভিযান) বনজ কুমার মজুমদার গ্রেপ্তারের বিষয়টি নিশ্চিত করেছেন।</p>\n<p style=\"text-align: justify;\">পুলিশ সূত্রে জানা গেছে এ বিষয়ে আরো জানানো হয়, এনামুলের সঙ্গে চট্টগ্রামেরও কয়েকজন শিবিরের নেতাকর্মীকে আটক করা হয়েছে।</p>\n",
        "excerpt": "<p>নাশকতার অভিযোগে ছাত্রশিবিরের কেন্দ্রীয় কার্যকরী পরিষদের সদস্য এনামুল কবিরকে গ্রেফতার করেছে চট্টগ্রাম মহানগর পুলিশ। শুক্রবার তাকে নগরীর বাকলিয়া থানার বগার বিল এলাকা থেকে গ্রেফতার করে পুলিশ। নগর পুলিশের অতিরিক্ত কমিশনার (অপরাধ ও অভিযান) বনজ কুমার মজুমদার গ্রেপ্তারের বিষয়টি নিশ্চিত করেছেন। পুলিশ সূত্রে জানা গেছে এ বিষয়ে আরো জানানো হয়, এনামুলের সঙ্গে চট্টগ্রামেরও কয়েকজন শিবিরের নেতাকর্মীকে …</p>\n",
        "date": "2015-02-21 15:38:41",
        "modified": "2015-02-21 15:38:41",
        "categories": [
            {
                "id": 960,
                "slug": "%e0%a6%9a%e0%a6%9f%e0%a7%8d%e0%a6%9f%e0%a6%97%e0%a7%8d%e0%a6%b0%e0%a6%be%e0%a6%ae-%e0%a6%ac%e0%a6%bf%e0%a6%ad%e0%a6%be%e0%a6%97",
                "title": "চট্টগ্রাম বিভাগ",
                "description": "",
                "parent": 11,
                "post_count": 50
            },
            {
                "id": 48,
                "slug": "%e0%a6%ac%e0%a7%8d%e0%a6%b0%e0%a7%87%e0%a6%95%e0%a6%bf%e0%a6%82-%e0%a6%a8%e0%a6%bf%e0%a6%89%e0%a6%9c",
                "title": "breaking",
                "description": "",
                "parent": 0,
                "post_count": 1132
            },
            {
                "id": 11,
                "slug": "%e0%a6%b8%e0%a6%be%e0%a6%b0%e0%a6%be%e0%a6%a6%e0%a7%87%e0%a6%b6",
                "title": "সারাদেশ",
                "description": "",
                "parent": 0,
                "post_count": 1347
            }
        ],

I want to show a particular news sorting by category. Like I want to show news what is into "breaking" category. I tried this code but it's not happening right.

<ion-item class="item-thumbnail-left"  ng-repeat="singleNews in news.posts" href="#/app/singleNews/{{singleNews.id}}">
            <span ng-repeat="cat in singleNews.categories | filter: {title: 'breaking'}">
                <img src="{{singleNews.thumbnail}}">
                <h2 ng-bind-html="singleNews.title"></h2>
                <div ng-bind-html="singleNews.excerpt"></div>
            </span>
 </ion-item>

I believe for better solution you need to create a custom filter. that will filter out if title is matching {title: 'special'}

app.filter('filterForTitle',function($filter){
  return function(news, prop1){
    var returnValue = [];
    angular.forEach(news,function(values,index){
      var matchedValue = $filter('filter')(values.categories,{title:'special'},true);
      if(matchedValue.length>0) returnValue.push(values);
    });
    return returnValue;
  }
});

HTML

<ion-item class="item-thumbnail-left" href="#/app/singleNews/{{singleNews.id}}" ng-repeat="singleNews in news.posts|filterForTitle">
    <img src="{{singleNews.thumbnail}}">
    <h2 ng-bind-html="singleNews.title"></h2>
    <div ng-bind-html="singleNews.excerpt"></div>
</ion-item>

Working CodePen

Filtered array is returning duplicate values everytime, i think service is only returning duplicate values.

For solving that issue we need to filter for inner ng-repeat like filter:{title: 'special'}" Thats weird part .

more