javascript - 函数内的 AngularJS 摘要

Question

假设我有以下 HTML

<div ng-if="running">
    <div id="someid"></div>
</div>
<span ng-click="myfunc">Click</span>

在angular controller中我设置了一个点击按钮的功能

$scope.myfunc = function(){
    $scope.running = true;

    //attach some jquery event
    $('#someid').on('animationend', function(){...})
}

我想在 running=true 之后立即更新 DOM，因为如果我不将附加事件放在其他地方，它就不会工作，因为 DOM 还不存在。 ng-if 似乎将其删除，并且仅在函数结束时才显示 div。我在运行后立即尝试了 $scope.$digest() 也不起作用，它显示错误。

那么附加上述事件的正确方法是什么？

Answer 1

尝试在您的 Controller 中使用 $timeout，以这种方式:

    myApp.controller('exampleController', ['$scope', '$timeout', function($scope, $timeout) {

                $scope.myfunc = function(){
                   $scope.running = true;            

                   var timeout = $timeout(function({
                     $('#someid').on('animationend', function(){...})  

                     $timeout.cancel(timeout);  
                   }, 0)
                }
            }]);

简而言之，$timeout以 0 作为间隔让您等待下一个摘要周期。