StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PO
text
Body
copied!<p>methods (aka not computed properties) are in the current context and should just be called like a method, and not with getters/setters.</p> <p>offsetPosition: (x) -> @position(x) + @get("offset")</p> <p>position: (x) -> x * 100</p> <p>Here's an example: <a href="http://emberjs.jsbin.com/eWIYICu/3/edit" rel="nofollow">http://emberjs.jsbin.com/eWIYICu/3/edit</a></p> <pre><code>App.AnAppleComponent = Ember.Component.extend({ offset: 50, position: function(x) { return x * 100; }, offsetPosition: function(x) { return this.position(x) + this.get('offset'); }, displayOffset: function(){ return this.offsetPosition(Math.floor(Math.random() * 10) + 1); }.property('offset') }); </code></pre> <p>Personally I'd create a mixin and add my methods in there, then add the mixin wherever that logic is needed. Mixins are in the scope of whatever they are added to.</p> <p><strong>BTW You can use Ember.Get(object, 'propertyOnObject') anywhere in the app.</strong></p> <p>In response to your edit, you are passing in methods into those attribute values instead of the values of those methods (which is why it works above, but not below). There is a good chance since you are sending in those methods jquery is applying those methods later way out of scope.</p> <pre><code>didInsertElement: -> data = [1, 2, 3] i = 1 d = data[i] position = @position(d, i) offsetPosition = @offsetPosition(d, i) console.log position console.log offsetPosition d3.select("svg").selectAll("circle").data(data).enter().append("circle").attr("cx", position).attr("cy", offsetPosition).attr "r", 30 </code></pre> <p>I have a feeling you are wanting this to dynamically update or something along those lines, if that's the case you really want to be using computed properties, the bacon of Ember. Here's an updated version of the apple component:</p> <p><a href="http://emberjs.jsbin.com/eWIYICu/5/edit" rel="nofollow">http://emberjs.jsbin.com/eWIYICu/5/edit</a></p> <pre><code><div {{bind-attr style='dynamicStyle'}}> dynamicStyle: function(){ var rgb = this.get('rgb'), rgb1 = rgb * 21 % 255, rgb2 = rgb * 32 % 255, rgb3 = rgb * 41 % 255; return 'background-color:rgb(' + rgb1 + ',' + rgb2 + ',' + rgb3 + ');'; }.property('rgb'), </code></pre>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload