简体   繁体   English

如何修改angular中注入的依赖项的依赖项?

[英]How do I modify a dependency of an injected dependency in angular?

I'm looking at the source code for the angular plugin of JQuery File upload, and I see the following code: 我正在查看JQuery File上传的angular插件的源代码,并且看到以下代码:

angular.module('blueimp.fileupload', [])
  // The fileUpload service provides configuration options
  // for the fileUpload directive and default handlers for
  // File Upload events:
  .provider('fileUpload', function () { ... })
  .controller('FileUploadController', [
        '$scope', '$element', '$attrs', '$window', 'fileUpload',
        function ($scope, $element, $attrs, $window, fileUpload) {

   ...
   // Observe option changes:
   $scope.$watch(
       $attrs.fileUpload,
       function (newOptions) {
           if (newOptions) {
               $element.fileupload('option', newOptions);
           }
       }
   );

so it seems obvious to me that the module was written to allow for me to update the options on the fileupload widget (which is what $element.fileupload('option', ...) does); 因此,对我来说显而易见的是,该模块被编写为允许我更新fileupload小部件上的选项(这是$ element.fileupload('option',...)的作用); however, I'm not sure how to get to the $attrs.fileUpload. 但是,我不确定如何到达$ attrs.fileUpload。

I need to update the options to fileupload after an async call in my controller: 在控制器中进行异步调用后,我需要更新文件上传选项:

var accountEditor = angular.module('accountEditor', [ 'ngResource', 'blueimp.fileupload' ]);
accountEditor.controller('accountEditorCtrl', [
            '$scope',
            '$resource',
            'fileUpload',
            function($scope, $resource, fileUpload) {
             doAsyncThing(function() {
                 // update options...what goes here?
             });

My current solution is a hack, and it is to mess with the options on a event callback (as described in How to change dynamically the upload (jquery-file-upload) url using $scope? ). 我当前的解决方案是破解,它会弄乱事件回调中的选项(如如何使用$ scope?动态更改上载(jquery-file-upload)URL中所述 )。 I consider this a hack because it requires user interaction for the options to get set, and also leads to a race condition where user interaction might occur before the async call is complete. 我认为这是一种破解,因为它需要用户交互才能设置选项,并且还会导致竞争状态,在异步调用完成之前,可能会发生用户交互。

Do you have the view code? 您有查看代码吗?

I would imagine you would need to update the options attribute on the controller. 我想您将需要更新控制器上的options属性。

eg 例如

View: 视图:

<div data-ng-controller="accountEditorCtrl">
    <form data-ng-controller="FileUploadController" data-file-upload="options">
    </options>
</div>

Controller: 控制器:

var accountEditor = angular.module('accountEditor', [ 'ngResource', 'blueimp.fileupload' ]);
accountEditor.controller('accountEditorCtrl', [
        '$scope',
        '$resource',
        'fileUpload',
        function($scope, $resource, fileUpload) {

        $scope.options = {}; // Set options here

         doAsyncThing(function() {
             $scope.options = {}; // Update options
             // Note if this async method is not handled by angular you may need
             // to call $scope.$apply(); to notify angular of the changes to scope
         });

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM