Javascript 安格拉斯承诺
我正在学习如何使用resolve from,并将其应用到我的Todo脚本中 然后我意识到了一个问题,这个示例只是向我展示了如何解决GET call,以便在我第一次访问此路线时获得Todo列表 但是,在同一路线的同一页面中,我有一个添加按钮来发布新的todo项目,还有一个清除按钮来删除已完成的项目 查看我的Javascript 安格拉斯承诺,javascript,angularjs,Javascript,Angularjs,我正在学习如何使用resolve from,并将其应用到我的Todo脚本中 然后我意识到了一个问题,这个示例只是向我展示了如何解决GET call,以便在我第一次访问此路线时获得Todo列表 但是,在同一路线的同一页面中,我有一个添加按钮来发布新的todo项目,还有一个清除按钮来删除已完成的项目 查看我的$scope.addTodo=function(){和$scope.clearpleted=function(){我想在操作后再次解析我的TodoList。我该怎么做 这是我的代码。在我的代码中
$scope.addTodo=function(){
和$scope.clearpleted=function(){
我想在操作后再次解析我的TodoList。我该怎么做
这是我的代码。在我的代码中,初始的resolve:{todos:TODOLISTRESL}
正在工作,它点击TODOLISTRESL
函数并生成承诺。但是,当我想再次解析todo列表时,我不知道如何处理addTodo
和clearComplete
main.js
var todoApp = angular.module('TodoApp', ['ngResource', 'ui']);
todoApp.value('restTodo', 'api/1/todo/:id');
todoApp.config(function ($locationProvider, $routeProvider) {
$routeProvider.when("/", { templateUrl: "Templates/_TodosList.html",
controller: TodosListCtrl, resolve: { todos: TodosListResl } });
$routeProvider.otherwise({ redirectTo: '/' });
});
//copied from example, works great
function TodoCtrl($scope, $rootScope, $location) {
$scope.alertMessage = "Welcome";
$scope.alertClass = "alert-info hide";
$rootScope.$on("$routeChangeStart", function (event, next, current) {
$scope.alertMessage = "Loading...";
$scope.alertClass = "progress-striped active progress-warning alert-info";
});
$rootScope.$on("$routeChangeSuccess", function (event, current, previous) {
$scope.alertMessage = "OK";
$scope.alertClass = "progress-success alert-success hide";
$scope.newLocation = $location.path();
});
$rootScope.$on("$routeChangeError",
function (event, current, previous, rejection) {
alert("ROUTE CHANGE ERROR: " + rejection);
$scope.alertMessage = "Failed";
$scope.alertClass = "progress-danger alert-error";
});
}
//also copied from example, works great.
function TodosListResl($q, $route, $timeout, $resource, restTodo) {
var deferred = $q.defer();
var successCb = function(resp) {
if(resp.responseStatus.errorCode) {
deferred.reject(resp.responseStatus.message);
} else {
deferred.resolve(resp);
}
};
$resource(restTodo).get({}, successCb);
return deferred.promise;
}
//now, problem is here in addTodo and clearCompleted functions,
//how do I call resolve to refresh my Todo List again?
function TodosListCtrl($scope, $resource, restTodo, todos) {
$scope.src = $resource(restTodo);
$scope.todos = todos;
$scope.totalTodos = ($scope.todos.result) ? $scope.todos.result.length : 0;
$scope.addTodo = function() {
$scope.src.save({ order: $scope.neworder,
content: $scope.newcontent,
done: false });
//successful callback, but how do I 'resolve' it?
};
$scope.clearCompleted = function () {
var arr = [];
_.each($scope.todos.result, function(todo) {
if(todo.done) arr.push(todo.id);
});
if (arr.length > 0) $scope.src.delete({ ids: arr });
//successful callback, but how do I 'resolve' it?
};
}
我认为你没有抓住解决问题的关键。
解决问题的关键是“。在您的情况下,您已经在一条路线上,并且希望保持在该路线上。但是,您希望更新成功回调上的todos
变量。在这种情况下,您不希望使用resolve
。相反,只需执行需要执行的操作。例如
$scope.addTodo = function() {
$scope.src.save({ order: $scope.neworder,
content: $scope.newcontent,
done: false }, function () {
todos.push({ order: $scope.neworder,
content: $scope.newcontent,
done: false });
});
//successful callback, but how do I 'resolve' it?
};
作为补充,我注意到您使用的是下划线库中的。
。您不需要使用其他库,因为Angular已经使用了。感谢您阅读我的长问题并给出宝贵的意见。那么,这是否意味着我的ToDoListResl函数中的延迟承诺没有用?di是什么如果我只做一个直接的$resource.get();而不是麻烦地构造延迟承诺。既然Resolve已经在做延迟了?这就是我困惑的地方,那么将Resolve和promise一起使用的示例的意义是什么?只有一个路由,您可能不需要解析/延迟承诺。解释$resource文档:调用$resource方法(如get())立即返回空引用(对象或数组)。一旦服务器返回数据,该引用将填充数据。这通常用于将资源分配给模型:空对象将导致不渲染,然后,一旦数据到达,模型/对象将填充数据,视图将自动更新。因此,在大多数情况下,您不必编写回调函数对于操作方法。如果要延迟显示全新视图(例如使用ng视图)直到数据(成功)显示,则Resolve和Promissions非常有用从服务器到达。通常情况下,您将使用多个路由。如果您确实需要使用承诺,我建议查看此答案,它使用$http而不是$resource:@MarkRajcok我有多个路由。只需剪切所有其他内容并使我的代码尽可能短。例如,您点击了一个项目的编辑,它会这样做到另一条路线。但是,是的,谢谢你的回复。我会看看。