データが変更されたときのANGULARJSとNG-INITスコープ
-
26-12-2019 - |
質問
だから私は現在、ユーザーが開始/終了日を選択して更新カレンダーをクリックすると、カレンダーアプリケーションがあります。これによりカレンダーが入力されます。しかし、範囲内の新しい要素を含む問題があります。たとえば、同じ機能を継続的に使用するのではなく、もう一度何度も「セル・デート」を計算するのではなく、週の曜日、曜日などからの「セル・デート」などを計算します。そして他の誰もがそれを使わせてください。どういうわけか私は多くの試みにもかかわらずこれを行うことができません。下のJSFIDDLEでは、各カレンダーセルの右上隅にある月の日付に気付くでしょう。ただし、日付を変更するには、月の前の月の前、月の更新の日数が更新されたが、セルに表示した「セル日」が更新されません。
たとえば、「SAT 05 2014」を取ります。 6/1から開始する日付を更新し、右端のセルはまだ「2014年7月05 2014」であっても6月7日を反映しています!関連するコードは、「Calcell」ディレクティブと「イベント」ディレクティブです。 CalcelLでは、CellDをNG-Init= 'CellD= CellDate(Num、Start_dt、$ INDEX)'として設定します。その後、イベントでは{{celld}}を使用して表示するだけです。イベントでCellDate(Num、Start_dt、$ INDEX)を使用して作業することができますが、私は本当に同じ機能をどこでも100万回使用したくありません。セルの日付をセルオブジェクトに保存できる方法はあり、データが変更されたときにそれを更新するだけですか?最終的に、私はその日のイベントデータを取得するための関数にセルの日付を渡します、その時にイベントがイベントデータを表示するために反復するでしょう。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;
}
}
});
.
ありがとう!
解決
eventタグに携帯電話を入れて作業することができました。それが役立つかどうかわからない。
<div events ng-attr-celld='{{cellDate(num, start_dt, $index)}}'></div>
.
それを交換する必要がありません、attrはスコープ値です。
//replace: true,
...
scope: {celld:'@'}
.
そしてあなたがまだ見たことがない場合 - angular ui calendar - 保存することができるあなたはしばらくしています。
所属していません StackOverflow