Question

我的angularJS模块中有一个指令，它集成了一个自定义的jQuery控件。控件是一个滑块，仅在修改全局变量$rootScope.vm时创建。滑块具有释放功能并且在该功能上（可以更改下限/上限）我想修改$rootScope.vm的2个属性并通过$rootScope.$watch调用广播此更改，以便控制器可以处理此更改。

问题在于，当我更改滑块位置时，它会进入释放功能，更改$rootScope.vm的值，但在广播时停止。如果我再次单击它，则会触发广播。我想知道为什么会发生这种情况，我该怎么做才能在第一次播放广播时（注意：我试图将true置于objectEquality但这并不能解决问题）

广播代码：

service.updateGlobalMileageFromModule = function (start, end) {
        console.log("Inside broadcast function");
        if (!this.vm) {
            this.vm = {};
        }
       this.vm.MileageStart = start;
        this.vm.MileageEnd = end;
        $rootScope.$broadcast("GlobalMileageFromModuleUpdated");        
    };

Angular指令：

    .directive('slider', function ($rootScope, BroadCastGlobalData) {
    var min, max, minPos, maxPos;
    var updateSliderRange = true;
    var releaseFunction = function (min, max) {
        console.log("Inside release function");
        $rootScope.vm.MileageStart = min;
        $rootScope.vm.MileageEnd = max;
        $rootScope.$apply();
        $rootScope.$watch('vm', function () {
            console.log("Inside $watch function");
            if ($rootScope.vm.MileageEnd != 0 && $rootScope.value.MileageStart != 0) {
                BroadCastGlobalData.updateGlobalMileageFromModule($rootScope.vm.MileageStart, $rootScope.vm.MileageEnd);
                updateSliderRange = false;
            }
        });
    };    
    return {
        restrict: 'EA',
        template: '<div></div',
        link: function (scope, element, attributes) {
            $rootScope.$on('GlobalMileageFromControllerUpdated', function () {
                //somehow limit this to only the first call on the facet load.
                if (updateSliderRange)
                {
                    min = BroadCastGlobalData.vm.MileageStart;
                    max = BroadCastGlobalData.vm.MileageEnd;
                }
                //this should be updated everytime the slider hands move.
                minPos = BroadCastGlobalData.vm.MileageStart;
                maxPos = BroadCastGlobalData.vm.MileageEnd;
                var slider = new range_slider({
                    selector: '.range-slider',
                    unit: ' miles',
                    min: min,
                    max: max,
                    left_scrubber_pos: minPos,
                    right_scrubber_pos: maxPos,
                    round_by: 1000,
                    rounded: true,
                    // Event during initialization
                    release: function (e) {
                        console.log("Slider released at positions: " + e.min + ", " + e.max);
                        //broadcast data changed. capture data in controller. make call to server for refreshed data.                        
                        releaseFunction(e.min, e.max);
                        //console.log("Event happened, this object contains: \n\n { \n min : " + e.min + ",\nmax : " + e.max + "\n}");
                    }
                });
            });
        }
    };
})

作为旁注，我正在使用ASP.NET MVC4

$ watch仅在第二次更新对象时触发

0 个答案: