Your scope should really be independent of elements for the most part. For example, I often create a separate, easily unit testable Map constructor that I use as my scope.
For instance:
- Turnstile = can.Map.extend({
- locked: true,
- coin: function(){
- this.attr("locked", false)
- },
- push: function(){
- this.attr("locked", true)
- }
- })
And then use Turnstile as your scope:
can.Component.extend({
tag: "turnstile",
template: "{{#if locked}}LOCKED{{else}}UNLOCKED{{/if}}"
scope: Turnstile
})