gpt4 book ai didi

angularjs - 如何将异步数据从指令传递到 Controller ?

转载 作者:行者123 更新时间:2023-12-02 22:57:18 25 4
gpt4 key购买 nike

我想将第三方 api (uploadcare) 编译为指令。

API 将在异步上传后返回数据信息,然后我想对 Controller 中的返回数据执行一些操作,但我必须知道如何将返回数据从指令传递到 Controller 。下面是我的代码。

js

        link: function (scope, element, attrs) {
//var fileEl = document.getElementById('testing');
var a = function() {

var file = uploadcare.fileFrom('event', {target: fileEl});
file.done(function(fileInfo) {

//scope.$apply(attrs.directUpload)
//HERE IS MY PROBLEM.
//How can I get the fileInfo then pass and run it at attrs.directUpload

}).fail(function(error, fileInfo) {

}).progress(function(uploadInfo) {
//Show progress bar then update to node
console.log(uploadInfo);
});
};

element.bind('change', function() {a()});
}

在 html 中

<input type="file" direct-upload="doSomething()">

在 Controller 中

$scope.doSomething = function() {alert(fileInfo)};

最佳答案

AngularJS 允许在 $parent 上下文中使用指定值执行表达式,在您的情况下为 doSomething()

这是您需要执行的操作:

  1. 在指令定义中,将 directUpload 标记为表达式:
scope: {
directUpload: "&"
}
  1. done 回调中,调用:
scope.directUpload({fileInfo: fileInfo})
  1. 更新标记:
<input type="file" direct-upload="doSomething(fileInfo)">

总结一下:scope.directUpload 现在是一个回调,它使用指定的值执行属性内的表达式。这样您就可以将任何内容传递到 Controller 的 doSomething 中。

阅读$compile docs详细解释和示例。

Example您可能会发现有用:

angular
.module("app", [])
.directive("onDone", function ($timeout) {
function link (scope, el, attr) {
$timeout(function () {
scope.onDone({
value: "something"
});
}, 3000)
}
return {
link: link,
scope: {
onDone: "&"
}
}
})
.controller("ctrl", function ($scope) {
$scope.doneValue = "nothing";
$scope.done = function (value) {
$scope.doneValue = value;
};
})
<body ng-controller="ctrl">
Waiting 3000ms
<br>
<div on-done="done(value)">
Done: {{doneValue}}
</div>
</body>

关于angularjs - 如何将异步数据从指令传递到 Controller ?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22803237/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com