3

サードパーティの API (uploadcare) をディレクティブにコンパイルしたいと考えています。

APIは非同期でアップロードされた後にデータ情報を返します。コントローラーで戻りデータを使用して何かをしたいのですが、戻りデータをディレクティブからコントローラーに渡す方法を考えなければなりません。以下は私のコードです。

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()">

コントローラーで

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

2 に答える 2

0

ディレクティブ内で = を使用してオブジェクトをディレクティブのスコープに渡し、双方向のデータ バインディングを行うことができます。このようにして、オブジェクトのディレクティブ内のデータを更新すると、コントローラーの元の場所に反映されます。コントローラーでは、 $scope.watch を使用して、ディレクティブによってデータがいつ変更されたかを確認できます。

何かのようなもの

http://plnkr.co/edit/gQeGzkedu5kObsmFISoH

// ここにコードが入ります

angular.module("myApp",[]).controller("MyCtrl", function($scope){
  $scope.something = {value:"some string"}
}).directive("simpleDirective", function(){
  return {
    restrict:"E",
    scope:{someData:"="},
    template:"<button ng-click='changeData()'>this is something different</button>",
    link: function(scope, iElem, iAttrs){
      scope.changeData=function(){
        scope.someData.value = "something else";
      }
    }
  }
});
于 2014-04-02T06:45:12.733 に答える