2012-11-26 14 views
13

Mam nadzieję, że wykorzystam dziedziczenie w Meteorze, ale nie znalazłem nic na ten temat w dokumentacji ani w Stack Overflow.Używanie dziedziczenia w meteor.js

Czy możliwe jest posiadanie szablonów dziedziczących właściwości i metody z innego abstrakcyjnego szablonu lub klasy?

+0

Stworzyłem [pakiet] (https://atmosphere.meteor.com/package/view) o nazwie 'widok' dla meteoru. Używam go do zawijania widoków meteorów z klasą widoku podobną do szkieletu. Może znajdziesz tam kilka pomysłów na początek. – Andreas

Odpowiedz

18

myślę krótka odpowiedź brzmi nie, ale tu jest już odpowiedź:

Jedno robiłem do udostępniania funkcji między szablonami jest określenie przedmiotu pomocników, a następnie przypisać je do wielu szablonów, jak więc:

var helpers = { 
    displayName: function() { 
     return Meteor.user().profile.name; 
    }, 
}; 

Template.header.helpers(helpers); 
Template.content.helpers(helpers); 

var events = { 
    'click #me': function(event, template) { 
     // handle event 
    }, 
    'click #you': function(event, template) { 
     // handle event 
    }, 
}; 

Template.header.events(events); 
Template.content.events(events); 

To nie jest dziedziczenie, ale pozwala na udostępnianie funkcji między szablonami.

Jeśli chcesz wszystkie szablony mieć dostęp do pomocnika, można zdefiniować globalne pomocnika jak tak (patrz https://github.com/meteor/meteor/wiki/Handlebars):

Handlebars.registerHelper('displayName',function(){return Meteor.user().profile.name;}); 
+0

Jest to całkiem przydatne. Dzięki. Co powiesz na przedłużenie wydarzeń? Jakieś pomysły? – Gezim

+0

W pewnym sensie doszedłem do tego niezupełnie satysfakcjonującego wniosku. –

+0

@Pilgrim Dodałem także kilka przykładów wydarzeń. – zorlak

2

mam odpowiedzieć na to pytanie here. Podczas gdy rozwiązanie nie używa inheritance, pozwala z łatwością udostępniać zdarzenia i pomocników poprzez szablony.

W skrócie, ja zdefiniować extendTemplate funkcję, która trwa w szablonie i obiekt z pomocników i zdarzeń jako argumenty

extendTemplate = (template, mixin) -> 
    helpers = ({name, method} for name, method of mixin when name isnt "events") 
    template[obj.name] = obj.method for obj in helpers 

    if mixin.events? 
    template.events?.call(template, mixin.events) 

    template 

Więcej informacji oraz przykład zobaczyć moje other answer.

+0

Najlepszą odpowiedzią, w OOP, jest zalecenie używania "składu na dziedziczenie", a ta odpowiedź faworyzuje pierwszą. –

1

Niedawno potrzebowałem tej samej funkcjonalności w mojej aplikacji, więc zdecydowałem się stworzyć własny pakiet, który wykona to zadanie po wyjęciu z pudełka. Mimo że wciąż trwają prace, możesz spróbować.

Zasadniczo, cała metoda jest następująca:

// Defines new method /extend 
Template.prototype.copyAs = function (newTemplateName) { 
    var self = this; 

    // Creating new mirror template 
    // Copying old template render method to keep its template 
    var newTemplate = Template.__define__(newTemplateName, self.__render); 
    newTemplate.__initView = self.__initView; 

    // Copying helpers 
    for (var h in self) { 
     if (self.hasOwnProperty(h) && (h.slice(0, 2) !== "__")) { 
      newTemplate[h] = self[h]; 
     } 
    } 

    // Copying events 
    newTemplate.__eventMaps = self.__eventMaps; 

    // Assignment 
    Template[newTemplateName] = newTemplate; 
}; 

W nowym szablonie (new_template.js), w którym chcesz przedłużyć swój streszczenie jednego, napisać następujące:

// this copies your abstract template to your new one 
Template.<your_abstract_template_name>.copyAs('<your_new_template_name>'); 

teraz możesz po prostu zastąpić pomocników lub zdarzenia (w moim przypadku jest to pomocnik photos), wykonując następujące czynności:

Template.<your_new_template_name>.photos = function() { 
    return []; 
}; 

Twoja wola odnosi się do nadpisanych metod pomocniczych i do abstrakcyjnych, które nie są nadpisywane.

Pamiętaj, że plik HTML nowego szablonu nie jest konieczny, ponieważ cały czas odnosimy się do abstrakcyjnego.

Kod źródłowy jest dostępny na Github here!