プロパティへのアクセス

Question

私はWebコンポーネント/カスタム要素への角度からプロジェクトを変換していますし、次のテキストフィールドにバインド作成することにより、ng-modelを交換しようとしています。このことから明らか

<input type="search" class="form-control search_input" placeholder="Search for someone new" value$="[[userLookup:input]]" required autocomplete="off"> 

角度から変換されて、私は、JavaScript関数にこの値にアクセスできるようにする必要があります。

(function(customElements) { 
    class RecentSearch extends PolymerMixins.LightDomMixin(Polymer.Element) { 
     static get is() { return 'recent-search'; } 

     static get properties() { 
      return { 
       properties: { 
        user: { 
         type: Object 
        }, 
        userLookup: { 
         type: String, 
         reflectToAttribute: true, 
         value: '', 
        }, 
       }, 
      }; 
     } 

     lookupUser() { 
      if (this.userlookup) { 
       $state.go('users', { query: userlookup }); 
      } 
     }; 
    } 
    customElements.define(RecentSearch.is, RecentSearch); 
})(window.customElements); 

私はlookupUser FUNC内部からuserLookupプロパティ（テキストフィールドにバインドされた1）にアクセスする方法を？

Answer 1

あなたはすでにthis.userLookupで正しくlookupUser()からuserLookupにアクセスしています。イベントハンドラのコンテキスト（すなわち、this）は、ポリマー要素のインスタンスです。

ただし、データバインディングは一方向のデータバインディングであるため、userLookupは更新されません。この種類のbindingは、双方向（中括弧で囲む）である必要があり、はで属性バインディング（つまり、$=）を使用できません。

<input placeholder="Search for someone new" 
     value="{{userLookup::change}}" /> 

demo

：

正しい使用方法は、このようなものでなければなりません