个人中心
gpt4 book ai didi

AngularJS:是否可以观看全局变量(即范围外)？

转载 作者：行者123 更新时间：2023-12-04 02:05:31 26 4
gpt4 key购买 nike

首先让我说我正在尝试做的事情可能不被认为是好的做法。但是，我需要做这样的事情，以便以小的增量步骤将大型 Web 应用程序迁移到 AngularJs。

我试着做

 $scope.$watch(function () { return myVar; }, function (n, old) {
                    alert(n + ' ' + old);
                });

其中 myVar 是全局变量(在窗口上定义)

然后从控制台更改 myVar。
但它只在第一次设置观察者时触发。

如果我从 Controller 内部更新 myVar 就可以工作(请参阅 http://jsfiddle.net/rasmusvhansen/vsDXz/3/ ，但如果它是从某些旧版 javascript 更新的，则无效

有没有办法实现这一目标？

更新
如果遗留代码完全不受限制，我喜欢安德斯的回答。但是，目前我正在研究这种似乎有效并且不包括每秒触发的计时器的方法: 
// In legacy code when changing stuff    
$('.angular-component').each(function () {
        $(this).scope().$broadcast('changed');
});

// In angular
$scope.$on('changed', function () {
    $scope.reactToChange();
});

即使我会采用另一种解决方案，我也会给 Anders 加分，因为他的解决方案正确地解决了上述问题。

最佳答案

这里的问题可能是您正在修改 myVar来自 Angular 世界之外。 Angular 不会一直运行摘要循环/脏检查，只有当应用程序中发生应该触发摘要的事情时，例如 Angular 知道的 DOM 事件。所以即使 myVar发生了变化，Angular 认为没有理由开始一个新的摘要循环，因为什么都没有发生(至少 Angular 知道)。

因此，为了触发您的 watch ，您需要在更改 myVar 时强制 Angular 运行摘要。 .但这会有点麻烦，我认为您最好创建一个全局可观察对象，如下所示:

<!doctype html>
<html ng-app="myApp">
<head>
    <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
    <script src="http://code.angularjs.org/1.0.5/angular.min.js"></script>
    <script>
    // Outside of Angular
    window.myVar = {prop: "value1"};
    var myVarWatch = (function() {
        var watches = {};

        return {
            watch: function(callback) {
                var id = Math.random().toString();
                watches[id] = callback;

                // Return a function that removes the listener
                return function() {
                    watches[id] = null;
                    delete watches[id];
                }
            },
            trigger: function() {
                for (var k in watches) {
                    watches[k](window.myVar);
                }
            }
        }
    })();

    setTimeout(function() {
        window.myVar.prop = "new value";
        myVarWatch.trigger();
    }, 1000);

    // Inside of Angular
    angular.module('myApp', []).controller('Ctrl', function($scope) {
        var unbind = myVarWatch.watch(function(newVal) {
            console.log("the value changed!", newVal);
        });

        // Unbind the listener when the scope is destroyed
        $scope.$on('$destroy', unbind);
    });
    </script>
</head>
<body ng-controller="Ctrl">

</body>
</html>

关于AngularJS:是否可以观看全局变量(即范围外)？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/15294565/

26 4 0
文章推荐： winapi - 什么是 nCmdShow？
文章推荐： fonts - 裸骨 x11 如何绘制 truetype 或其他抗锯齿字体？
文章推荐： jakarta-ee - struts2 在页面加载时禁用验证
文章推荐： .net - 主机特定在 t4 模板中意味着什么？
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com