Javascript 如何在文件上传时在angular js中单击调用自定义指令？

我在这里看到了很多用Angular JS上传文件的解决方案。他们中的大多数安装额外的模块（如ngUpload、angular file upload）或创建一个自定义指令，该指令在上传完成后立即调用

自定义指令方式正在工作，我正在上传以获得上传文件的挂钩。但是我希望上传只在点击按钮后开始。因此，我尝试在单击时调用该指令，但无法读取该指令中的文件输入

我正在使用的自定义指令：

app.directive('fdInput', [function () {
return {
    template: '<div></div>',
    replace: true,
    link: function (scope, element, attrs) {
        element.on('change', function  (evt) {
            var files = evt.target.files;
            console.log(files[0].name);
            console.log(files[0].size);
            scope.callbackFn({file :  sfiles[0]});
        });
   }
};
}]);

app.directive（'fdInput'，[function（）{
返回{
模板：“”，
替换：正确，
链接：函数（范围、元素、属性）{
元素。on（'change'，function（evt）{
var files=evt.target.files；
console.log（文件[0].name）；
console.log（文件[0].size）；
callbackFn（{file:sfiles[0]}）；
});
}
};
}]);

单击时的自定义指令代码：

app.directive('fdInput', [function () {
return {
    template: '<div></div>',
    replace: true,
    link: function (scope, element, attrs) {
         scope.processFile= function() {
             console.log('inside processFile method');
         };
   }
};
}]);

app.directive（'fdInput'，[function（）{
返回{
模板：“”，
替换：正确，
链接：函数（范围、元素、属性）{
scope.processFile=函数（）{
log（'insideprocessfile方法'）；
};
}
};
}]);

有没有一种方法可以像在第一个代码中一样在第二个代码中读取文件

---

我想实现文件上传点击在角度不包括额外的模块。非常感谢您的帮助。

您应该能够通过访问指令中的控制器范围来实现这一点

这里的指令范围提供了一些非常好的示例

---

希望有帮助

这个概念对我很有用，但是使用这个链接，但是我现在在将表单数据发送到RESTAPI时遇到了问题。有关于如何发送文件内容的链接吗？