13

$scope.$watch配列内の各要素にa を設定する方法を理解しようとしています。各要素の特定の属性のみを気にします。

この例では、各オブジェクトに、、およびのrental_date3 つの属性があります。を変更するたびに、を の2 時間後に設定したいと考えています。datestart_timestop_timestart_timestop_timestart_time

$ngResource呼び出し ( Angular 1.1.5を使用):

Agreement.show( 
  id: 5 
).$then ((success) ->
  $scope.agreement = success.data.agreement

  # returns an array of rental dates
  $scope.rental_dates = success.data.rental_dates

  # $watch goes here

$watch私が試した機能の4つのバリエーションは次のとおりです。

1:

angular.forEach $scope.rental_dates, (date, pos) ->
  $scope.$watch date.start_time, ((newval, oldval) ->
    $log.info 'watch changed'
    $log.info newval
    $log.info oldval
  ), true

2:

angular.forEach $scope.rental_dates, (date, pos) ->
  $scope.$watch $scope.rental_dates[pos].start_time, ((newval, oldval) ->
    $log.info 'watch changed'
    $log.info newval
    $log.info oldval
  ), true

3:

angular.forEach $scope.rental_dates, (date, pos) ->
  $scope.$watch 'rental_dates[pos].start_time', ((newval, oldval) ->
    # also tried '$scope.rental_dates[pos].start_time'

    $log.info 'watch changed'
    $log.info newval
    $log.info oldval
  ), true

4:

これは機能しますが、現時点では、$watch配列全体ではなく、関心のある値のみにアクセスするためのエレガントなソリューションは考えられません。

$scope.$watch 'rental_dates', ((newval, oldval) ->
  $log.info 'watch changed'
  $log.info newval
  $log.info oldval
), true

自分のプロジェクトで似たようなことをした人はいますか?

4

3 に答える 3

27

どういうわけか ng-repeat を使用して、配列の各エントリの UI 要素を生成していると思いますか? これらの UI 要素のそれぞれに ng-controller を割り当てます。コントローラーは、配列要素ごとにインスタンス化されます。そのコントローラー内で、$watch を使用します。

<div ng-repeat="rentalDate in rental_dates" ng-controller="RentalDateController">
</div>

そして、コントローラーコードで：

angular.module(...).controller('RentalDateController', function ($scope) {
    $scope.$watch('rentalDate.start_time', function (startTime) {
        ...
    });
});

ここにちょっとした例があります: http://plnkr.co/edit/lhJ3MbULmahzdehCxVeM?p=preview

于 2013-08-07T15:24:36.690 に答える
8

$watch最初の引数を次のように変更すると、ソリューション番号 3 が機能すると思います'rental_dates['+pos+'].start_time'( $watchは角度式を最初のパラメーターとして取り、 pos はスコープの一部ではありません)。

(これは機能するはずですが、これはあまり効率的ではないと思います。すべての開始時刻の変更を監視するのではなく、start_time と stop_time の両方を同時に更新することを検討する必要があるかもしれません。)

于 2013-08-07T15:08:56.343 に答える
8

コレクションの一部であるオブジェクトの特定のフィールドを監視したい場合、およびコレクションのアイテムを ng-repeat によってビューで反復し、監視対象のフィールドを ng を持つことができるコントロールにバインドしている場合-change を使用すると、ng-change ハンドラーを使用して監視の側面をいつでも処理できます。例えば：

 <div ng-repeat="binding in bindings track by $index">
     <input ng-model="binding" ng-change="changed(binding)">
 </div>

そしてjsで：

 scope.changed = function(binding){
      .....
 }
于 2015-11-19T10:55:08.180 に答える