无法访问指令中的父作用域，它是只读的

Question

首先，我发现我无法更改directive

中的值

所以我必须使用$scope.$applyAsync来修改quick_search_ctrl控制器的范围，

并使用$scope.$watch启用双向绑定。

我是Angular.js的新手， 我认为将更新逻辑放在指令中是奇怪的而且不直观 我怎么能把逻辑放在quick_search_ctrl？ 为什么我不能只修改$scope.slider_status.from的值，而是需要在applyAsync中包装动作？

我对指令和控制器有什么不妥吗？

由于

main.js

var quick_search_app = angular.module('quick_search_app', ["highcharts-ng"]);

quick_search_ctrl.js

quick_search_app.controller('quick_search_ctrl',
  ...
  $scope.slider_status = {from: "test"};
});

ionslider.js

quick_search_app.directive('ionslider',function(){
    return{
        restrict:'AE',
        scope: false,
        controller: 'quick_search_ctrl',
        link:function($scope, $element){
            $($element).ionRangeSlider({
                    onChange: function(slider) {
                        $scope.$applyAsync(function(){
                            $scope.slider_status.from = slider.from;
                        });
                        $scope.$watch('slider_status', function() {
                            // change the parent's model here
                        });
                    }
            })
        }
    }
});

Answer 1

您必须在true中使用$watch作为第三个参数：

$scope.$watch('slider_status', function() {
    // change the parent's model here
}, true);

因为您尝试观看需要deep观看的对象。 查看更多相关信息https://docs.angularjs.org/api/ng/type/ $ rootScope.Scope