javascript - データ変更時の angularjs および ng-init スコープ

Question

そのため、現在、ユーザーが開始日と終了日を選択し、カレンダーの更新をクリックするカレンダー アプリケーションがあります。これにより、カレンダーが作成されます。ただし、スコープに新しい要素を含めるのに問題があります。たとえば、開始日、週番号、曜日などからセルの「セル日付」を計算するために同じ関数を何度も繰り返し使用する代わりに、セルの日付をそのスコープに一度格納したいそしてみんなに使ってもらいましょう。何度も試みたにもかかわらず、どういうわけか私はこれを行うことができません。以下の JSFiddle では、各カレンダー セルの右上隅に日付が表示されていることがわかります。ただし、日付を変更すると、たとえば 1 か月前に日付が更新されますが、セルに表示されている「セルの日付」は更新されません。

たとえば、「2014 年 7 月 5 日土曜日」とします。日付を 6/1 に開始するように更新します。右端のセルは、その月の日が 6 月 7 日を反映しているにもかかわらず、「2014 年 7 月 5 日土曜日」のままです。関連するコードは「callcell」ディレクティブと「events」ディレクティブにあります。calcell では、celld を ng-init='celld=cellDate(num, start_dt, $index)' として設定しました。次に、イベントで {{celld}} を使用して単純に表示します。イベントで cellDate(num, start_dt, $index) を使用して機能させることができましたが、同じ関数をどこでも何百万回も使用したくありません。セルの日付をセルオブジェクトに保存し、それを子スコープで使用して、データが変更されたときに更新する方法はありますか? 最終的には、セルの日付を関数に渡して、その日付のイベント データを取得します。その後、イベントはそれらを反復処理して、イベント データを表示します。

フィドルリンク

app.directive("events", function($compile, DateService) {
        return {
            restrict: "A",
            replace: true,
            scope: true,
            template: 
                    "<div>{{celld}}</div>",
            link: function(scope, element, attrs) {
                scope.DateService = DateService;
            }
        }
    });

    //calendar cell 
    app.directive("calcell", function($compile, DateService) {
        return {
            restrict: "A", 
            replace: true, 
            scope: true,
            template: 
                "<td ng-init='celld=cellDate(num, start_dt, $index)' id='{{\"td\" + DateService.getDateInt(cellDate(num, start_dt, $index))}}' \
                        realclass='{{getScopeClass(cellDate(num, start_dt, $index))}}'>\
                    <div>\
                        <a class='CellDay'>{{DateService.getMonthDay(cellDate(num, start_dt, $index))}}</a>\
                    </div>\
                    <br/>\
                    <br/>\
                    <br/>\
                    <br/>\
                    <div events></div>\
                    </div>\
                </td>",
            link: function(scope, element, attrs) {                 
                scope.DateService = DateService;
            }
        }
    }); 

ありがとう！