更改

2015-05-06 28 views
10

假設給定的形式,如<form name="myForm">關注表單模型,它很容易地用一個簡單的表的有效性,錯誤的,骯髒的狀態等等看:更改

$scope.$watch('myForm.$valid', function() { 
    console.log('form is valid? ', $scope.myForm.$valid); 
}); 

然而,似乎沒有是一種簡單的方法來觀察這種形式的任何輸入是否已經改變。深觀看像這樣,不工作:

$scope.$watch('myForm', function() { 
    console.log('an input has changed'); //this will never fire 
}, true); 

$watchCollection只能深藏在一個層面上,這意味着我將不得不創建一個新的手錶,每輸入。不理想。

什麼是優雅的方式來觀看任何輸入的變化形式,而不必訴諸多個手錶,或在每個輸入上放置ng-change

+3

[AngularJS 1.3 - \'ng-change \'-like functionality for the整個表單]的可能重複(http://stackoverflow.com/questions/28677638/angularjs-1-3-ng-change-like-功能爲整個表格) – DTing

+0

該問題的指令解決方案有效,但這不是我想到的(即不夠高雅,因爲它需要模糊才能工作)。理想情況下,我希望這樣做的工作方式類似於在子輸入適當更改後,角度內部立即將表單設置爲$ valid或$ error。 – Duncan

回答

7

關於possible duplicate和您的評論:

在這個問題的解決方案的指令工作,但它不是我的初衷(即不優雅,因爲它需要模糊爲了工作)。

如果添加true作爲第三個參數爲您$watch它的工作原理:

$scope.$watch('myFormdata', function() { 
    console.log('form model has been changed'); 
}, true); 

更多信息請參閱docs

Working Fiddle(檢查控制檯日誌)


另一個多角度的方式是使用角度的$pristine

Fiddle

+0

事實上,我知道它的工作方式假設你的表單域共享一個共同的父對象。我可以用這種方式使用手錶 - 我最好希望有一種方法可以使用表單名稱,而不是每個輸入都綁定的模型 – Duncan

+0

這取決於您是否需要新的值。如果你只是想現在有什麼改變,你應該使用'$ pristine'。 – DonJuwe

+0

它在自動保存的上下文中,所以雖然''pristine'''或''dirty'''對於第一次更改會很有用,但除非我手動設置,否則它們不會對每個後續更改都有用每次保存時的原始/骯髒的價值對我來說似乎有點難以理解。我可能不得不對這些投入份額模型進行深入觀察。 – Duncan

3

根據我與我的形式體驗(新開發的,但現在有角工作了一段時間),優雅的方式收看:一旦你操縱的表單模型此布爾屬性將被設置爲false實際上,變化形式實際上並不使用任何類型的觀察聲明。
使用內置的Angular boolean $ pristine或$ dirty,這些值將在任何輸入字段或複選框中自動更改。
這個問題是:如果你添加或拼接數組讓我難倒了一段時間,它不會改變它的值。
對我來說最好的解決方法是手動做$scope.MyForm.$setDirty();每當我添加或從我不同的陣列中刪除。 工作就像一個魅力!