为什么模型更改时$watch不更新

Why is $watch not updating when the model changes

本文关键字：watch 更新 模型 为什么      更新时间：2023-09-26

为什么手表每次更换模型时都不会记录？

为什么输入不是以值测试开头？

(function () {
    'use strict';
    // Create the application.
    var app = angular.module('tabApplication', []);
    // Creat the tabs controller.
    app.controller('tabController', ['$log', '$scope', function ($log, $scope) {
        $scope.myName = 'test';
        $log.log($scope.myName);
        
        $scope.$watch('myName', function(newValue, oldValue) {
            $log.log(newValue, oldValue); 
        });
    }]);
}());
<!DOCTYPE html>
<html lang="en-US">
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.0/angular.min.js"></script>
<body>
<div ng-app="tabApplication" ng-controller="tabController as tabC">
	<p>Name : <input type="text" ng-model="tabC.myName"></p>
	<h1>Hello {{tabC.myName}}</h1>
</div>
</body>
</html>

您是否尝试过观看字符串'tabC.myName'而不是仅仅观看'myName'：

$scope.$watch('tabC.myName', function(newValue, oldValue) {
    $log.log(newValue, oldValue); 
});

ng-model="tabC.myName"不绑定到$scope.myName变量，这就是为什么输入在开始时显示为空而不是"test"的原因。

请尝试ng-model="myName"而不是;)

正如 cl3m 答案所指出的那样，因为您使用控制器作为语法，您必须注意"tabC.myName">

另一种方法是使用this来设置变量，并导入$scope以使用$watch功能 

(function () {
    'use strict';

    // Create the application.
    var app = angular.module('tabApplication', []);
    // Creat the tabs controller.
    app.controller('tabController', ['$log', '$scope', function ($log, $scope) {
        this.myName = 'test';
        $log.log(this.myName);
        $scope.$watch('tabC.myName', function(newValue, oldValue) {
            $log.log(newValue, oldValue); 
        });

    }]);
}());
相关文章：