Javascript 赋值后的回调函数

我正在写一个angular应用程序，angular对关注点的分离非常固执己见

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

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

下面是一个JSFIDLE，它显示了：

现在请记住，我试图找到一个优雅的解决方案，不会破坏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服务调用

在这种情况下，您需要使用

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

检索电影详细信息

找回它的明星阵容

将响应分配给范围变量

为您服务，您将拥有

    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;
            });  
       });
    };