Ember-Ansichtsvorlage als berechnete Eigenschaft
Ich habe Probleme beim Aktualisieren der Vorlageneigenschaft in einer Ember-Ansicht, wenn es sich um eine berechnete Eigenschaft handelt.
Ember kompiliert die Vorlage korrekt, wenn die Ansicht zum ersten Mal geladen wird und als Eigenschaft zurückgegeben wird. Die berechnete Eigenschaft der Vorlage wird jedoch nicht aktualisiert, wenn die Abhängigkeit später geändert wird.
Hier ist ein Beispiel für JSFiddle:http://jsfiddle.net/VkJC3/
App=Em.Application.create();
App.MyView = Em.View.extend({
toggle: true
,template: function(){
if (this.get('toggle')) {
return Em.Handlebars.compile('toggle is true')
} else {
return Em.Handlebars.compile('toggle is false')
}
}.property('toggle')
});
theView= App.MyView.create();
theView.append('body');
Ember.run.later(function() {
console.log('later');
theView.set('toggle',false);
}, 2000);
Alle anderen Vorschläge, wie dies erreicht werden kann, sind willkommen. Vielleicht ist es am besten, einfach Helfer in eine Lenkervorlage zu packen.
BEARBEITEN:
Hier ist ein vollständigeres Beispiel, das die Ember.CollectionView zeigt, die die obige Ember.View enthält:http://jsfiddle.net/VkJC3/6/
Nach dem Ember.run.later sollte das erste Element von Typ 1 zu Typ 2 wechseln und die berechnete Schabloneneigenschaft aktualisieren.
App=Em.Application.create();
App.MyView = Em.CollectionView.extend({
content: [
Em.Object.create({type: 1, data:"Maybe item type 1 is a link"})
,Em.Object.create({type: 2, data:"And item type 2 is a header"})]
,itemViewClass: Em.View.extend({
template: function(){
if (this.get('content.type')==1) {
return Em.Handlebars.compile('<a href="#">{{view.content.data}}</a>')
} else if (this.get('content.type')==2) {
return Em.Handlebars.compile('<h1>{{view.content.data}}</h1>')
}
}.property('content.type')
})
});
theView= App.MyView.create();
theView.append('body');
Ember.run.later(function() {
console.log('later');
theView.get('content')[0].set('type',2);
}, 2000);