Mam stronę internetową z dynamiczną treścią. Powiedzmy, że to strona produktu. Kiedy użytkownik przechodzi bezpośrednio doexample.com/product/123 Chcę zrenderować szablon produktu na serwerze i wysłać html do przeglądarki. Jednak gdy użytkownik później kliknie link do/product/555 Chciałbym użyć JavaScript do aktualizacji szablonu po stronie klienta.

Chciałbym użyć czegoś takiego jak Knockout.js lub Angularjs, ale nie widzę, w jaki sposób mogę wstępnie wypełnić te szablony niektórymi danymi początkowymi na serwerze i wciąż mieć działający szablon na kliencie. tj. jeśli moim szablonem Angular jest:

<ul>
    <li ng-repeat="feature in features">
      {{feature.title}}
      <p>{{feature.description}}</p>
    </li>
</ul>

Gdy użytkownik przejdzie bezpośrednio do adresu URL, potrzebuję czegoś, co nadal działa jako szablon Angular, ale jest wypełnione kodem HTML dla bieżącego produktu. Oczywiście to nie działa:

<ul>
    <li ng-repeat="feature in features">Hello
      <p>This feature was rendered server-side</p>
    </li>
    <li>Asdf <p>These are stuck here now since angular won't replace them when
       it updates.... </p></li>
</ul>

Wygląda na to, że moją jedyną opcją jest wysłanie HTML-owego serwera do przeglądarki wraz z osobnym pasującym szablonem ...?

W takim przypadku chciałbym uniknąć dwukrotnego pisania każdego szablonu. Co oznacza, że ​​muszę albo przełączyć się na JavaScript dla mojego języka serwera (z którego nie byłbym zadowolony), albo wybrać język szablonu, który kompiluje się zarówno do Java, jak i JavaScript, a następnie znaleźć sposób na włamanie go do Play Framework (co jest tym Obecnie używam.)

Czy ktoś ma jakieś rady?