7

カレンダーの日付を表す JSON オブジェクトがあります。これらは CMS を介して追加され、日付に基づいてフィルター処理できるようにしたいと考えています。私のスキーマの設定により、これは思ったより難しくなりました。この JSON オブジェクトの day 値で orderBy することは可能ですか、またはフィルターの回避策はありますか?

これが私のJSONオブジェクトです:

{
"_id" : ObjectId("53f252537d343a9ad862866c"),
"year" : {
    "December" : [],
    "November" : [],
    "October" : [],
    "September" : [],
    "August" : [],
    "July" : [ 
        {
            "day" : "21",
            "title" : "Event Title",
            "summary" : "Event Summary",
            "description" : "oEvent Description",
            "_id" : ObjectId("53f252537d343a9ad862866d")
        }
    ],
    "June" : [],
    "May" : [],
    "April" : [],
    "March" : [],
    "February" : [],
    "January" : []
},
"__v" : 0
}

これは、カスタム フィルターを使用して月ごとにフィルター処理するビューです。orderBy は機能していませんが、機能を設定したい場所を示すプレースホルダーとして残しました。

<div class="calDynamic" data-ng-repeat="n in [] | range:100">
<div ng-repeat="cal in calendar[n].year | filterKey:month">
  <div ng-if="cal != '' ">
    <div class="calendar">


    <div ng-repeat="item in cal | orderBy: 'key.day' ">

        <a href="/events/{{item.day}}">
          <article class="eventslist">
           <div class="numberedDate">
               <h3>{{item.day}}</h3>
            </div>
            <div class="calInfo">
               <h5>{{item.title}}</h5>
               <p>{{item.summary}}&nbsp;<a>more</a></p>
            </div>
           </article>


      </div><!-- ng-repeat val,key -->
</div><!-- calendar -->
</div><!-- ng-if cal -->
</div><!-- ng-repeat cal -->
</div><!-- calDynamic -->
4

1 に答える 1

16

オブジェクト内の任意のアイテムでソートするカスタムソート関数を定義できるはずです。重要な点は、フィルター関数でオブジェクトを配列に変換することです。

次に例を示します。

app.filter('orderByDayNumber', function() {
  return function(items, field, reverse) {
    var filtered = [];
    angular.forEach(items, function(item) {
      filtered.push(item);
    });
    filtered.sort(function (a, b) {
      return (a[field] > b[field] ? 1 : -1);
    });
    if(reverse) filtered.reverse();
    return filtered;
  };
});

次に、次のように呼び出します。

<div ng-repeat="(key, val) in cal | orderByDayNumber: 'day' ">

val.day想定されているため、記述しないでください。

詳細については、こちらのすばらしいブログ投稿をご覧ください。

編集:実際には、構造は実際には既に配列であるように見えるため、この手法は引き続き機能しますが、必要ではない可能性があります.orderByにパラメーターを追加する方法が問題を引き起こしている可能性があります.

于 2014-08-19T03:11:49.277 に答える