2016-07-28 7 views
2

Polymer 1.5を使用していますが、実際には "this"変数が外部にマップされないようにする必要があります。 私はtypescriptがこれをいくつかはvalid reasonsにしていることを知っています。変数の上にこれを参照してください"this"が書き直されないようにするTypeScriptコンパイル

$this = this; 
var MyBehavior = MyBehavior || {}; 

MyBehavior.FormSubmit = { 
    _setInvalid: (query, status) => { 
     var elems = Array.prototype.slice.call(Polymer.dom($this.root).querySelectorAll(query)); 
     elems.forEach(element => { 
      if (status) { 
       element.setAttribute('invalid', status); 
      } 
      else { 
       element.removeAttribute('invalid'); 
      } 
     }); 
    } 
}; 

declare var Polymer: any; 
var MyBehavior = MyBehavior || {}; 

MyBehavior.FormSubmit = { 
    _setInvalid: (query, status) => { 
     var elems = Array.prototype.slice.call(Polymer.dom(this.root).querySelectorAll(query)); 
     elems.forEach(element => { 
      if (status) { 
       element.setAttribute('invalid', status); 
      } 
      else { 
       element.removeAttribute('invalid'); 
      } 
     }); 
    } 
}; 

はその後にマッピングされ得るのだろうか?これでコードが破られます。私が "this.root"やそれに相当するものにアクセスできれば、それは不思議に過ぎません。 TypeScriptが "this"を動かさないようにする方法はありますか?

P.S:PolymerTSについて知りました!残念ながら、Polymerオブジェクトからビヘイビアを呼び出すことはできません。

+1

矢印機能(=>)をサポートしているJavaScriptでも、これはキャプチャされたかのように機能します。古い学校の「この」行動が必要な場合は、古い学校の機能を使う必要があります。 – recursive

答えて

4

私は矢印の機能を使用していないに注意してください、しかし、通常の関数の方法の

MyBehavior.FormSubmit = { 
    _setInvalid: function(query, status) { 
     var elems = Array.prototype.slice.call(Polymer.dom(this.root).querySelectorAll(query)); 
     elems.forEach(element => { 
      if (status) { 
       element.setAttribute('invalid', status); 
      } 
      else { 
       element.removeAttribute('invalid'); 
      } 
     }); 
    } 
}; 

つの矢印機能は、通常の関数の構文と異なる矢印関数内でこのキーワードがあるということですクラス/オブジェクトにバインドされます。

typescriptですコンパイラが古いJavaScriptのパターンである

var _this = this; 

トリックを使用するECMAScript 5に矢印機能(ECMAScriptの6)を翻訳する際に、「この」の意味は変更されませんことを確認します。

+0

バムバムバム!それだった!本当にありがとう!ワオ。私は、矢印関数がクラス/オブジェクトにバインドされていることを知らなかった。私はいつも、それがfunction()の砂糖構文短縮形だと考えてきました。それで、なぜそれがすべての方法でそれを上にマッピングしていたのかを説明します! –

関連する問題