angular.js - $watch monitors the drop-down box. It will be automatically executed once when the web page is refreshed. How to disable automatic execution?

Question

Detailed description:
$watch monitors a drop-down box, and the expectation is that only when the user clicks an option in the drop-down box, the front end will request the back end to update data.

The current problem is:
When the web page is loaded and the drop-down box appears for the first time, $watch will be automatically executed once. The ng mechanism believes that loading is a user click.

Want to know how to disable automatic execution of $watch in this case

迷茫 · Answer

Thanks for the invitation.

First of all, can I correct a small flaw in wording.

You said "$watch monitors a drop-down box", ng是一个实现数据双向绑定的，具有声明式API的框架，这里的$watch是不可能去监视一个DOM元素下拉框that's right. The appropriate wording can be written as "an expression monitored by $watch that points to the selected value of the drop-down box" which is more accurate (friends who are good at Chinese can further optimize).

When asking questions, we tend to focus too much on the answers we want to know and ignore the way of expression. As a result, we often end up in vain. This type of question is very common in SF. The questioner’s description is vague, making it impossible to answer. In fact, I can still understand the description of the question, but I just want to say a few more words because of my feelings.

Back to the subject, since you don’t want to process the data initialization time$watch, you can judge it like this

$scope.$watch('表达式', function(newVal, oldVal){
    //当之前值和当前值相同，或者之前值为null或undefined时
    if(newVal === oldVal || oldVal == null){
        //不执行任何操作
        return;
    }
    
    //你的正常代码，写这里
});

PHPz · Answer

http://docs.ngnice.com/api/ng/type/$rootScope.Scope

scope.$watch('name', function(newValue, oldValue) {
  if(newValue == oldValue) return;
  scope.counter = scope.counter + 1;
});

習慣沉默 · Answer

Use ngChange to avoid initialization calls

Attention:

Needs to be used together with ngModel
Using a program to change the value of ngModel will not trigger ngChange

Evaluate the given expression when the user changes the input. The expression is evaluated immediately, unlike the JavaScript onchange event which only triggers at the end of a change (usually, when the user leaves the form element or presses the return key).

ngChange Documentation