2017-03-08 1 views
1

私は 'jQueryユニバース'を離れ、より多くのバニラJSを使いたいと思っていました。私はTypescriptを使用して利点を追加することにしました。ここに問題があります:TypeScript - 要素を循環するFormData(getAll()またはentries()を使用)

投稿リクエストを送信する直前に、要素を順番に調べる必要があります。活字体がなければ私はformDataElement.entries()のようなものを使用することがあります(あるいは単に1つの要素formDataElement.getAll('keyForMyFirstEntry')をチェックする。

しかしPhpStormとコンパイラが「のgetAll」などの特性が存在しないと、私に語った「エントリ」

V2A-16:area51 v2a$ tsc --out public/js/d3-fileupload.vanilla.js module/Application/assets/ts/d3-vanilla-fileupload.ts 
module/Application/assets/ts/d3-vanilla-fileupload.ts(274,12): error TS2339: Property 'getAll' does not exist on type 'FormData'. 

V2A-16:area51 v2a$ tsc --out public/js/d3-fileupload.vanilla.js module/Application/assets/ts/d3-vanilla-fileupload.ts 
module/Application/assets/ts/d3-vanilla-fileupload.ts(274,36): error TS2339: Property 'entries' does not exist on type 'FormData'. 

だからここに私の質問は以下のとおりです。

  • はなぜ活字体は彼のライブラリー(lib.d.ts)で追加サポートされていない、または私はprepaへのすべての要素を一周することができますどのように新しいバージョン
  • がありますそれらの再私のポストの要求

コード:

function FileSelectHandler($event) { 
    let $files = $event.target.files || $event.dataTransfer.files; 
    let $targetName = $event.target.getAttribute('data-related-element'); 
    let $relatedElement = document.querySelectorAll('[name="' + $targetName + '"]'); 
    let $uri = $relatedElement[0].getAttribute('data-upload-uri'); 
    let $xhr = new ajax(); 
    if ($files) { 
     [].forEach.call(
      $files, 
      function ($file) { 
       $data.append('file[]', $file); 
      } 
     ); 
    } 
    $xhr.post(
     $uri, 
     $data 
    ); 
} 

class ajax { 
    [...] 
    public post(
     $url: string, 
     $data: FormData, 
     $callback: (text: any) => any = function() {}, 
     $async: any = true 
    ) { 
     let $query = []; 
     if ($data !== undefined) { 

      /* 
      * Please Help... doesn't work 
      */ 

      for (let $key in $data.entries()) { 
       $query.push(encodeURIComponent($key) + '=' + encodeURIComponent($data[$key])); 
      } 
     } 
     this.send($url, $callback, 'POST', $query.join('&'), $async) 
    } 
} 

答えて

0

OK - 時間といくつかの新しい灰色の毛の束の後:

  • エントリ()とのgetAll()ではありませんすべてのブラウザでサポートされています。 SafariとIEが欠落していて、その理由は、タイスクリプトのサポートが欠落していることです!
  • 要素で行う必要があるものはすべて、の前にをFormDataに追加する必要があります。このケースではencodeURIComponent()(とはい、それは簡単かもしれません)

しかし、おそらく解決策があります。私はすべてのオブジェクトのための少しプレビューを考えています、そして、この救済で、私は利用可能なすべてのアイテムのすべてのテンプレートを保持する必要があります。その場合、上部のコードのようなpost-circling optionがいいでしょう。

関連する問題