Angular指令绑定事件并将参数传递给控制器​​函数

Question

我有这个指令绑定和事件到输入文件元素，并调用控制器上的函数

appFuncionario.directive('onFileChange', function () {
   return {
      restrict: 'A',
      link: function (scope, element, attrs) {

         var onChangeHandler = scope.$eval(attrs.onFileChange);
         //this is where I want to send the parameter
         element.on('change', onChangeHandler);

         element.on('$destroy', function () {
            element.off();
         });

      }
   };
});


<input ng-show="campo.codTipoCampo === 'InputFile'" id="{{campo.id}}" type="file" campo="{{campo}}" on-file-change="uploadFile" />

 //Function in the controller - this is where I want to get a parameter from the directive
 $scope.uploadFile = function (parameter) {

        //do something here
};

我需要将一个参数从指令所在的对象传递给指令对change事件执行的函数。

我知道我可以在元素上使用类似campo="{{campo}}"的东西，并在指令上像attrs.campo一样抓住它，但我无法弄清楚如何进行此绑定< / p>

element.on('change', onChangeHandler);

传递参数 - 我总是得到这个错误

  

jqLit​​e＃on（）不支持selector或eventData。

这里是Plunkr

Answer 1

这是你正在寻找的吗？我试图在这里找出更大的图景，为什么你要在指令级别中填充变量，而不仅仅是将控制器用于它的目的，而是看一下{{ 3}}下面和lmk，如果这是你正在寻找的东西。

＆＃13;

＆＃13;

// Code goes here

var app = angular.module('fiddle', []);

app.controller('MainCtrl', function($scope) {
  $scope.teste = function(campo) {
    alert("Campo: " + campo);
  };
  
});

app.directive('onFileChange', function() {
  return {
    restrict: 'A',
    link: function(scope, element, attrs) {

      var onChangeHandler = scope.$eval(attrs.onFileChange);
      element.on('change', function() {
      	onChangeHandler(attrs.campo);
      });

      element.on('$destroy', function() {
        element.off();
      });

    }
  };
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="fiddle">
  <div ng-controller="MainCtrl">
    <!-- 
      Attribute campo is the variable stuffed into the 
      controller function via the directive on change event
    -->
    <input type="file" campo="{{'I did it!'}}" on-file-change="teste" />
  </div>
</div>

＆＃13;

＆＃13;

＆＃13;