Question

我正在编写一个有角度的应用程序，Angular对于关注点的分离非常自以为是。

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

在我的控制器中，我试图从Web服务获取数据，然后使用从第一个接收的数据获取所有其他Web服务 - 由于javascript异步性质，我无法找到一个好方法来执行此操作在关注点分离方面没有越过界限。

这是一个显示它的jsfiddle：

现在请记住，我正在努力寻找一种不会破坏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;
}

Answer 1

虽然在普通函数调用方面代表了问题，但很明显，您将改为进行Web服务调用。

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

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

检索电影详情。



找回它的明星演员。



将响应分配给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;
            });  
       });
    };

赋值后的回调函数

1 个答案: