$ scope。$ watch没有捕获全局变量

时间:2016-01-10 17:12:06

标签: javascript angularjs angularjs-directive angularjs-scope javascript-objects

在HTML中

<div id="myMessage" value="{{myMessage}}" ng-model="myMessage">

<script>
    var myMessage ;
    function showMessage(message) {
                console.log("message type is" +message.type);
                myMessage = message ;
    }
</script>

总是有一个web套接字或ajax调用来继续在函数showMessage中获取消息参数的值。因此,全局变量myMessage的值也会不断变化,但它不会反映在控制器监视功能中。

在Controller.js文件中

var myApp = angular.module('myApp', [])
myApp.controller('executeController', function($scope, $http) {
$scope.myMessage;
$scope.myMessage = document.getElementById('myMessage').value;

$scope.$watch('myMessage' , function(newValue, oldValue){
    console.log("myMessage in controller" +$scope.myMessage);
})

我无法将代码从html脚本标记转移到控制器。但需要在控制器文件中不断更改的消息参数的值。我做错了什么?请帮忙..

2 个答案:

答案 0 :(得分:0)

控制器中的$scope.myMessage与“脚本”部分中的var myMessage不同。

$scope.$watch('myMessage'..)观察范围中的变量而不是“脚本”部分中的变量。

以下行仅在控制器首次执行时运行一次,因此手表永远不会获得新值:

 $scope.myMessage = document.getElementById('myMessage').value;

为什么不在控制器中进行AJAX调用?

答案 1 :(得分:0)

myMessage转换为函数并观察该函数:

var myApp = angular.module('myApp', []);

myApp.controller('executeController', function($scope, $http) {
    var myMessage = function() {
        return document.getElementById('myMessage').value;
    });

    $scope.$watch(myMessage() , function(newValue, oldValue){
        console.log("myMessage changed to: " + newValue);
    });
});

以这种方式实现,在每个摘要周期中,AngularJS框架调用myMessage()函数来检查值,并在值更改时使用新值调用处理函数。