在setTimeout中修改ng-show

bay*_*ezy 1 javascript angularjs

我有一个像这样的控制器: -

appControllers.controller("TaskAddController", function ($scope, $http) {
    $scope.task = {};
    $scope.messages = {};

    $scope.actions = {
        save : function() {
            $http.post("/ajax/tasks/save", $scope.task)
            .then(function() {
                $scope.messages.success = true;
                $scope.task = {};

                setTimeout(function () {
                    $scope.messages.success = false;
                }, 3000);
            });
        }
    };
});
Run Code Online (Sandbox Code Playgroud)

视图如下: -

<div data-ng-controller="TaskAddController">
    <div data-ng-show="messages.success">Task Added</div>
    <div>
        <input data-ng-model="task.title" type="text" placeholder="Title...."/>
    </div>
    <div>
        <textarea data-ng-model="task.description" placeholder="Description..."></textarea>
    </div>
    <div>
        <input data-ng-click="actions.save()" type="submit" value="add"/>
    </div>
</div>
Run Code Online (Sandbox Code Playgroud)

我想要做的是完成AJAX请求我要显示div包含任务添加,然后3秒后它消失了第一部分工作,例如当AJAX请求完成时div出现,但即使我的setTimeout肯定正在发生,div并没有消失.

从我的研究开始,我认为这是因为我需要获得Angular摘要.所以我尝试了以下方法: -

setTimeout(function () {
    $scope.messages.success = false;
    $scope.apply();
}, 3000);
Run Code Online (Sandbox Code Playgroud)

但这似乎并没有什么不同.我错过了什么?

Jay*_*kla 7

你应该用$timeout.

$timeout(function () {
    $scope.messages.success = false;
}, 3000);
Run Code Online (Sandbox Code Playgroud)

注意:您需要注入$timeout控制器.