赋值后的回调函数

Callback function after an assignment

本文关键字：函数 回调 赋值      更新时间：2023-09-26

我正在写一个angular应用程序，angular对关注点的分离非常有意见。

我有一个控制器和一个服务，我不希望我的代码破坏关注点的分离。

在我的控制器中，我试图从一个web服务获取数据，然后用从第一个web服务接收的数据获取所有其他web服务的数据。由于javascript异步的性质，我无法找到一个好的方法来做到这一点，而不必在关注点分离方面越界。

这是一个展示它的jsfiddle：

http://jsfiddle.net/yak2m1ve/

现在请记住，我正在努力寻找一个不会破坏SoC的优雅解决方案，而不是让它工作的肮脏黑客。

//controller
var x = fn1();
var y = fn2(x);
alert(y);
//service
function fn1(){
    setTimeout(function(){
        return '123'; //web request example
    }, 1000);
}
function fn2(code){
    return 'asdfb' + code;
}

尽管plunker用普通函数调用来表示问题，但很明显，您将进行web服务调用。

在这种情况下，您需要使用Angular Promise API。

例如，假设您应该执行以下操作序列。

  1. 检索电影详细信息。

  2. 取回它的星型。

  3. 将响应分配给Scope变量。

在您的服务中，您将拥有

    this.getMovie = function(movie) {
        return $http.get('/api/v1/movies/' + movie)
               .then(
                  function (response) {
                    return {
                       title: response.data.title,
                       cost:  response.data.price
                    });
                  });
    };
    this.starCast = function(movie) {
        return $http.get('/api/v1/movies/' + movie)
               .then(
                  function (response) {
                    return {
                       title: response.data.title,
                       cost:  response.data.price
                    });
                  });
    };

在你的控制器中：

    $scope.getMovie = function(movie) {
       service.getMovie(movie) 
       .then(function(movieData) {
          service.getStarCast(movieData).then(function(response) {
              $scope.starCast = response;
            });  
       });
    };
相关文章：