使用$ watch兩個變量angularjs

我有一個彈出式屏幕，用戶需要從兩個下拉列表中進行選擇。選擇完成後，我將選擇返回到服務並將它們保存在一個對象中。

app.service('OriginalService', [ '$modal', 

function ($modal) { 
var that = this; 

this.filtersMananger = { // my-ng-models for the two drop-down-lists 
    firstFilter: "", 
    secondFilter: "" 
}; 

this.openDialog = function(){ 
    var modalInstance = $modal.open({ 
     templateUrl: 'ModalScreen.html', 
     controller: 'ModalController', 
     resolve: { 
      filtersManagerObject: function() { 
       return that.filtersMananger; 
      } 
     } 
    }); 

    modalInstance.result.then(function (filtersMananger) { 
     that.filtersMananger.firstFilter = filtersMananger.selectedFirstFilter; 
     that.filtersMananger.secondFilter = filtersMananger.selectedSecondFilter; 
    }, function() { 

    }); 
}; 
} 
]);

的彈出HTML：

<div class="data-filters-container"> 
<div class="data-filter"> 
    <label for="filter-data-drop-down">FIRST FILTER</label> 
    <select name="filterDataDropDown" ng-model="filtersMananger.selectedFirstFilter" ng-options="filter.value as filter.name for filter in filterDropDownItems"></select> 
</div> 
    <div class="data-filter col-xs-4"> 
    <label for="filter-data-drop-down">SECOND FILTER</label> 
    <select name="filterDataDropDown" ng-model="filtersMananger.selectedSecondFilter" ng-options="filter.value as filter.name for filter in filterDropDownItems"></select> 
</div>

但是，這種變化是很重要的，我有打電話給哪知道許多其他服務，向他們發送有關此更改的信息提供給控制器。

爲了做到這一點，我用一個控制器中的手錶功能：

$scope.$watch('OriginalService.filtersMananger.firstFilter + OriginalService.filtersMananger.secondFilter', function (newVal, oldVal) { 

     if (newVal !== oldVal) { 

      DO SOME LOGIC 
     } 
    });

我的newval和OLDVAL之間比較，因爲當應用程序被上傳稱爲事件，我們進入到這個功能。

問題是newVal只包含secondVariable的值。是否有任何想法爲什麼newVal不包含也是第一個變量？

來源

2014-10-10 Aviade

您可以在這裏添加您的UI下拉綁定代碼，以查看它是否與firstVariable存在綁定問題。 – 2014-10-10 07:40:14

我添加了完整的示例:) – Aviade 2014-10-10 07:51:41

使用$watchCollection：

$scope.$watchCollection('[serviceName.Object.firstVariable,serviceName.Object.secondVariable]', function (newValues, oldValues) { 

});

或者，如果你使用的角度1.3使用$watchGroup：

$scope.$watchGroup(['serviceName.Object.firstVariable','serviceName.Object.secondVariable'],function(newValues, oldValues){ 

})

來源

2014-10-10 07:47:06

我測試了你的第一個選項，我可以看到newValues和舊值數組包含兩個未定義的元素.... – Aviade 2014-10-10 07:50:49

然後很有可能'serviceName.Object.x'是未定義的。 – 2014-10-10 07:52:56

它正在工作！謝謝 – Aviade 2014-10-10 08:02:17

你也可以用你的選擇NG-變化。的NG-變化將調用完成你的邏輯

<div class="data-filters-container"> 
    <div class="data-filter"> 
     <label for="filter-data-drop-down">FIRST FILTER</label> 
     <select name="filterDataDropDown" ng-change="checkFilterOne()" ng-model="filtersMananger.selectedFirstFilter" ng-options="filter.value as filter.name for filter in filterDropDownItems"></select> 
    </div> 
    <div class="data-filter col-xs-4"> 
    <label for="filter-data-drop-down">SECOND FILTER</label> 
    <select name="filterDataDropDown" ng-change="checkFilterTwo()" ng-model="filtersMananger.selectedSecondFilter" ng-options="filter.value as filter.name for filter in filterDropDownItems"></select> 
</div>

它會調用函數時，你的模式將改變這種狀況就像一個$手錶的功能。

來源

2014-10-10 07:58:23

使用$ watch兩個變量angularjs

回答

相關問題