gpt4 book ai didi

javascript - 如何在 angular.js Controller 中处理异步?

转载 作者:行者123 更新时间:2023-11-30 10:30:32 26 4
gpt4 key购买 nike

我是 angular.js 的新手。我对如何在 Controller 中处理异步事件感到困惑。

例如,在一个页面中,我有一个名为count 的 View 。当我点击一个按钮时, Controller 将计数增加 1。但增加是异步的。我想要的是,当 count 改变时, View 将被通知并改变它的值。但是在下一次点击时, View 不会改变它的值。

这是示例代码:

<!DOCTYPE html>
<html ng-app>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script>
</head>

<body>
<div ng-controller="Controller">
{{ count }}
<form ng-submit="delayInc()">
<input type="submit" value="Add" />
</form>
</div>

<script>
function Controller($scope) {
$scope.count = 0;

$scope.delayInc = function () {
setTimeout(function () {
$scope.count += 1;
}, 1000);
};
}
</script>
</body>
</html>

更新:

感谢您的所有回答。但我在问一个生成的问题。 setTimeout函数是http请求怎么样?我知道 $http 可以做到这一点。但是如果这个函数是处理文件之类的东西呢?除了每个异步调用我都没有为我提供服务。如果不存在,我是否需要自己编写一个?

最佳答案

使用 $timeout service而不是原生的 setTimeout:

function Controller($scope, $timeout) {
// ^---- Don't forget to inject the service
$scope.count = 0;

$scope.delayInc = function () {
$timeout(function () {
$scope.count += 1;
}, 1000);
};
}

或者,您可以使用 Scope.$digest() 告诉 Angular 手动应用您的更改(上面显示的 $timeout 服务将有效地为您执行此操作):

function Controller($scope) {
$scope.count = 0;

$scope.delayInc = function () {
setTimeout(function () {
$scope.count += 1;
$scope.$digest();
}, 1000);
};
}

关于javascript - 如何在 angular.js Controller 中处理异步?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17166861/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com