ポリマー本とCytoscapeこの

Question

だから私は問題を抱えていると私はまだJavaScriptを得ることはありませんので、それが最も可能性が高いです... Cytoscapeは「この」自分自身を持っており、ポリマーは、彼らの「この」

<div id="labelFld">{{node.label}}</div> 
    <div id="measureFld">{{node.measure}}</div> 
    <div id="timesignatureFld">{{node.time_signature}}</div> 
    <div id="voiceFld">{{node.voice}}</div> 
    <div id="beatFld">{{node.beat}}</div> 
    <div id="meventFld">{{node.event}}</div> 

var cy; 
cytoscape({ 
    ready : function() { 
       Polymer: ({ 
       ... 
         properties : { 
           node : { 
           type : Object, 
           notify : true, 
           readOnly : true 
         } 
       }, 
       ... 

を持っています

// Fires when the local DOM has been fully prepared 
ready : function() { 
    var self_node = this.node; // <- 'this' via Polymer 
    try { 
     cy = cytoscape({ 
       container : this.$.rhythmgraph, 
       ready : function (e) {} 
      }); 
    } catch (err) { 
     console.log(err); 
    } 

    // Assign handler to Cytoscape click event for node elements 
    cy.on('click', 'node', { 
     "nodedata" : self_node // <- Seems to pass by value, not reference 
    }, function (e) { 
     self_node = this.data(); // <- 'this' via Cytoscape 
     console.log(self_node); 
     // e.data.nodedata = this.data(); 
    }); 
}, 

しかし、更新するために 私<div>{{node.label}}</div>私はthis.node.label = "N42" // Polymerを行うことができるようにする必要がありますが、私は内側にありthis.data() // Cytoscapeを必要とするので、私はcy.on('click','node', ...)でそれを行うことはできません。

スコープが実際に私を殺しています。

EDIT

最後に、私が見て、更新するためにオブザーバーを作成しました：

self_node = this.selectedNode; 
    var poly = this; 

    Object.observe(self_node, function(changes) { 
     changes.forEach(function(change) { 
     if(change.type == "update") { 
     poly.selectedNode = { 
      "id":  change.object.id, 
...         } 
     }; 
     poly.notifyPath('selectedNode.id', change.object.id); 

     } 
    });}.bind(poly)); 

Answer 1

私はこれにJS devの初心者の間で共通の落とし穴を見つけます。関数を適切なthis参照にバインドする必要があります。 ES2015で

cy.on('click', 'node', { 
    "nodedata" : rhynode 
}, function (e) { 
    e.data.nodedata = this.data(); 
    console.log(e.data.nodedata); 
}.bind(this)); // here 

、矢印の機能が適切thisに自動的に結合するであろう：

cy.on('click', 'node', { 
    "nodedata" : rhynode 
}, (e) => { 
    e.data.nodedata = this.data(); 
    console.log(e.data.nodedata); 
});