Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/434.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 在没有$scope的情况下修改作用域无效。$apply_Javascript_Angularjs - Fatal编程技术网

Javascript 在没有$scope的情况下修改作用域无效。$apply

Javascript 在没有$scope的情况下修改作用域无效。$apply,javascript,angularjs,Javascript,Angularjs,我有一个按钮的指令,当点击它时会显示一个加载屏幕 angular.module('randomButton', ['Data']) .directive('randomButton', function(Data) { return { scope: '=', restrict: 'A', templateUrl: 'templates/components/randomButton.html', link: funct

我有一个按钮的指令,当点击它时会显示一个加载屏幕

angular.module('randomButton', ['Data'])

.directive('randomButton', function(Data) {
     return {
        scope: '=',
        restrict: 'A',
        templateUrl: 'templates/components/randomButton.html',
        link: function(scope, element, attrs){

            element.click(function(){
                scope._loading();
            });

        }
    }
});
它通过在不同指令中包含的作用域上调用另一个函数来实现这一点:

angular.module('quoteContainer', [])

.directive('quoteContainer', function(Data) {

    function quoteController($scope){

        $scope._loading = function(){
            console.log('loading');
            $scope.loadMessage = Data.getRandomText();
            $scope.loading = true;              
        };

    }

    return {
        scope: '=',
        restrict: 'A',
        templateUrl: 'templates/components/quoteContainer.html',
        controller: ['$scope', quoteController],
        link: function(scope,element,attrs){

        }
    }
});
我的问题是,要进行此更改,我必须在
\u load()
函数中调用
$scope.$apply
。例如:

$scope._loading = function(){
    console.log('loading');
    $scope.$apply(function(){
        $scope.loadMessage = Data.getRandomText();
        $scope.loading = true;              
    });         
};

我知道这是一种不好的做法,应该只在与其他框架/ajax调用等进行交互时使用。那么,为什么我的代码在没有
$scope.$apply.
的情况下会拒绝工作,没有它我如何才能工作呢?

基本上,您需要让angular知道发生变化的某种方式,因为它位于异步事件处理程序中,angular通常用于注意更改的机制不适用于它

因此,需要将其包装在
$apply
中,这将在代码运行后触发摘要循环,从而使angular有机会根据新数据进行更改。但是,实现这一点的首选方法是使用angular的内置服务,该服务有效地实现了相同的功能(即将代码包装在
$apply
块中),但不会出现触发其他摘要循环时可能正在进行的问题

您可以使用与当前使用$apply相同的方法:

$timeout(function(){
    $scope.loadMessage = Data.getRandomText();
    $scope.loading = true;              
});         

(如果您确实想延迟值的应用,可以使用第二个参数,但在您的情况下这不是必需的。)

尝试使用角度功能,例如
ng click
指令,而不是jquery(
click()
),因此每次我想要修改作用域上的变量时(不被监视)我得打$timeout?这似乎是一种非常奇怪的做法。只有当更改的来源在angular框架之外时(在本例中,是浏览器交互)。当您对$scope函数进行“常规”调用时,angular将知道更改并更新视图,而无需$timeout或$apply-这应该是大多数情况下的情况,$timeout是奇数。啊,感谢您为我澄清这一点!所以,为了确保我得到了它,外部更改意味着我应该使用$timeout,内部更改应该得到处理?