Question

我有多个类别的文件上传，给我的HTML有这些不同的类别，每个类别都有多个文件的文件上传控件。所有这些部分（以及每个部分的文件上载）都显示在一个HTML中。我创建了一个文件上传指令，我将它用于每个上传部分。这样可以处理一个名为＆＃34; Upload＆＃34;单击事件，此按钮是指令的一部分。

现在，有一个名为＆＃34;全部上传＆＃34;点击其中我必须一次更新属于不同部分的所有文件。因此，我必须通过单击此按钮上传所有指令中的文件。我怎样才能拥有此功能。

Answer 1

我不确定是否有更好的方法可以尝试：

将控制器中的值传递给所有指令，然后在每个指令上为该值附加$watch。然后单击Upload All按钮将更改该值，触发所有指令运行。

控制器：

app.controller = function('Ctrl', function($scope) {
  $scope.uploadAllFlag = false;

  $scope.uploadAll = function() {
    $scope.uploadAllFlag = !$scope.uploadAllFlag;
  }
});

指令：

app.directive = function('directive', function() {
 return {
   scope: { flag: '=' }
   link: function(scope) {
      scope.$watch('flag', function(){
         //do your upload stuff
      }
   }
});

或者替代地，在您的控制器上注入$ rootScope并广播您可以捕获指令的事件：

app.controller = function('Ctrl', function($rootScope, $scope) {
  $scope.uploadAll = function(){
    $rootScope.$broadcast('uploadAll');
  };
});

app.directive = function('directive', function(){
 link: function(scope) {
   scope.$on('uploadAll', function(){
     //do something
   }
 }
});

Answer 2

我创建了一个简单的jsfiddle。主要想法包括在那里：http://jsfiddle.net/VpmV2/45/

[1]http://jsfiddle.net/VpmV2/45/

多个文件上载指令和一个提交按钮

2 个答案: