一、$watch簡單使用
$watch
是乙個scope
函式,用於監聽模型變化,當你的模型部分發生變化時它會通知你。
?
1
$watch(watchexpression, listener, objectequality);
每個引數的說明如下:
watchexpression:監聽的物件,它可以是乙個angular表示式如'name',或函式如function()
。
listener:當watchexpression
變化時會被呼叫的函式或者表示式,它接收3個引數:newvalue
(新值),oldvalue
(舊值),scope
(作用域的引用)
objectequality:是否深度監聽,如果設定為true,它告訴angular檢查所監控的物件中每乙個屬性的變化. 如果你希望監控陣列的個別元素或者物件的屬性而不是乙個普通的值, 那麼你應該使用它
舉個栗子:?
12
3
4
5
6
7
8
9
10
11
12
13
14
15
$scope.name =
'hello'
;
var
watch = $scope.$watch(
'name'
,
function
(newvalue,oldvalue, scope));
$timeout(
function
(),1000);
二、監聽多個值的變化
大家通常遇到的情況為通過$watch()
一次監聽乙個值的變化,當然這種時候滿足絕大部分情況。但是通過閱讀官網對於$watch()
的解釋,$watch()
還有第三個引數,第三個引數是乙個布林型別,表示是否深度監聽,深度監聽的例子就是是否進行比較物件的屬性。
這樣我們就可以實現一次監聽多個值的變化。
示例**
?
1
2
3
4
5
6
7
8
9
var
,)
.controller(
"watchcontroller"
,[
"$scope"
,
function
($scope);
$scope.object.one=$scope.one;
$scope.object.one=$scope.one;
$scope.$watch(
"object"
,
function
(),
true
);
}])
vue通過watch監聽資料變化
一 通過watch來監聽資料變化,並通過列印顯示 personal center text placeholder 請輸入 v model inputval export default watch 效果圖 二 首次渲染開啟監聽 按上面的 實現,網頁眉次渲染是不會啟動監聽的,如果我們需要第一次渲染變...
vue中監聽資料變化 watch
今天做專案的時候,子元件中資料 原本固定的資料 需要父元件動態傳入,如果一開始初始化用到的資料 但當時還沒有獲取到,初始化結束就不會更新資料了。只有監聽這兩個屬性,再重新執行初始化。1 watch是乙個物件,物件就有鍵跟值,鍵就是我們要監聽的資料,值可以是函式 當我們監聽的資料發生變化時,需要執行的...
Vue監聽多個值
在使用vue進行開發時,我們有時會遇到這樣的需求 當某些變數同時不為空時才進行某些業務邏輯操作。我們一看到需求就會想到使用偵聽器watch來完成,大多數人在剛開始學習vue的時候,接觸到的是只需要監聽乙個值,然後進行業務邏輯操作,對於多值監聽,可能很陌生,但其實它也很容易實現,一句話來說就是 先定義...