Inter-Communication（服务控制器指令）

Question

我正在开发一个多文件上传模块，并且在不使用$rootScope时遇到了从我的服务到我的控制器的通信。

指令监视文件输入并将文件onchange传送到服务，在服务中上传并监视上载进度。基于回应（来自成功，错误和进度变化），父母控制器应该显示大拇指和进度。

我不想在我的$rootScope上使用$emit和$on，因为我需要的模式经常是安静的，只有一个父控制器需要知道上传。

我创建了一个简化的（！）Plunkr与一些额外的信息，以更好地了解问题。

是否有另一种方式让我的控制器对变化作出反应（发生在服务工厂内）？
或者也许完全不同的方式来实现这样的？

Answer 1

用Angular处理异步操作的正确方法是使用promises。

您可以从服务呼叫中返回承诺并将其解析为拇指的src。你可以不使用任何指令。

你的控制器将使用该服务是这样的：

function ParentController($scope, imageService) { 
    $scope.change = function() { 
    $scope.src = imageService.change(); 

    $scope.then(function(result) { 
     // the loading ended, but there is no need to set the src 
     // as it will already bind to src when ends. 
    }, function(err) { 
     // something went wrong 
    }); 
    }; 
} 

您的服务：

app.factory('imageService', function($q, $rootScope) { 

    function doTheUploading(defer) { 
    if (everythingOk) { 
     defer.resolve(thumbSrcString); 
    } else { 
     defer.reject({something: 'an error ocurred'}); 
    } 
    } 

    return { 
    change: function() { 
     // creates the promise 
     var defer = $q.defer(); 
     doSomethingAsync(defer); 
     return defer.promise; 
    } 
    }; 

}); 

至少，你的HTML应该是这样的：

<div ng-controller="ParentController"> 
    <img src="{{ src }}"><br><br> 
    <span class="btn" ng-click="change()">Change!</span> 
</div> 

关于进度，您将需要使用回调或返回可带来承诺和进度的对象指标（即：return {promise: defer.promise, percent: 0}）。应该从服务内部更新进度指示器。

你也可以链中的承诺，如果你之前设置需要从服务器返回的URL进行任何改造它的src财产，即：

$scope.src = imageService.change().then(function(result) { 
    return 'http://dummyimage.com/' + result; 
    }); 

更新your Plunker。