AngularJS指令隔离范围不更新父级

时间:2014-03-16 18:06:57

标签: javascript angularjs scope

我有一个带有模式绑定双向的指令,当通过ng-click调用save()方法时,除非我调用$ scope,否则不会更新父作用域。$ apply()然后抛出$ apply已经在进行中的错误。

我使用ngResource,并且该事件有一个监听器调用$ scope.model。$ save();

有解决办法吗?或者我做错了什么?

.directive('editable', function(){
    return {
        restrict: 'AE',
        templateUrl: '/assets/partials/editable.html',
        scope: {
            value: '=editable',
            field: '@fieldType'
        },
        controller: function($scope){

           ...

            $scope.save = function(){
                $scope.value = $scope.editor.value;
                $scope.$emit('saved');
                $scope.toggleEditor();
            };

        }
    };
})

更新

看起来它正在更新父节点,但是在摘要完成之前就会触发emit。我可以使用$ timeout强制它到堆栈的末尾,但感觉有点hacky。还有更好的方法吗?

$scope.$on('saved', function(){
    $timeout(function(){
        $scope.contact.$update();
    }, 0);
});

1 个答案:

答案 0 :(得分:1)

你是如何调用$ scope.save的?如果你使用其中一个angular指令,比如ng-click,angular会自动为你运行一个摘要周期,因此你不需要调用$ scope。$ apply()。在内部,角度检​​查在开始另一个循环之前是否已经在进行摘要,因此如果您使用其中一个内置指令,它将处理您正在进行的摘要问题。例如,将它放在指令的模板中......

<button ng-click="save()">Save</button>

如果你需要从控制器或链接功能调用save,你可以做一点点黑客以防止“正在进行的摘要”错误。使用$ timeout服务将调用推迟到调用堆栈的末尾...

$scope.save();
$timeout(function() {
    $scope.$apply();
}, 0);

我们将超时设置为0,因此没有实际延迟,但这仍然足以将$ apply调用推送到当前调用堆栈的末尾,这允许正在进行的摘要首先完成,防止错误。这并不理想,可能意味着您的设计存在更大的问题,但有时您只需要让它工作