Question

我创建了一个返回构造函数的工厂。构造函数包括一个查看实例属性的观察者。在测试中更改该属性时，不会触发观察者。在测试之外，它被解雇了。 $ rootScope。$ apply似乎没有帮助。

这是一个包含我的代码和测试的简化版本的jsfiddle。

//--- CODE --------------------------
(function (angular) {
    var myApp = angular.module('myApp', []);

    myApp.factory('MyObject', function($rootScope) {
        function MyObject() {
            this.prop = 5;
            this.watcherCallback = angular.noop;

            $rootScope.$watch(this.prop, this.watcherCallback);
        }

        return MyObject;
    });
})(angular);


// ---SPECS-------------------------
describe('MyObject', function () {
    beforeEach(module('myApp'));

    var MyObject, rootScope;
    beforeEach(inject(function (_MyObject_, $rootScope) {
        MyObject = _MyObject_;
        rootScope = $rootScope;
    }));

    it('calls the watcher when "prop" updates', function() {
        var newObj = new MyObject();
        spyOn(newObj, 'watcherCallback');

        newObj.prop = 10;
        rootScope.$apply();

        expect(newObj.watcherCallback).toHaveBeenCalled();
    });
});

观察者为什么不开火？

Answer 1

var newObj = new MyObject();

这会将noop分配给newObj.watcherCallback。它将newObj.watcherCallback（因此，noop）注册为观察者caallback。

spyOn(newObj, 'watcherCallback');

这将用另一个函数替换newObj.watcherCallback，这可以让你知道何时调用这个新的间谍函数。但它并没有将这个间谍功能注册为rootScope的观察者回调。什么是寄存器是原始寄存器：noop。

因此，当您更改属性的值并调用$apply()时，rootScope仍然会引用noop函数并调用它。你的间谍没有意识到这一点。

如果你在构造函数中执行它应该可以正常工作：

var that = this;
$rootScope.$watch(this.prop, function() {
    that.watcherCallback();
});

构造函数中的AngularJS观察者在测试时未被触发

1 个答案: