Question

Assuming that I have something like this :

<footer>
    <div id="home">
        Lorem ipsu 1 ...
    </div>
    <div id="about">
        Lorem ipsu 2 ...
    </div>
    <div id="plans">
        Lorem ipsu 3 ...
    </div>
</footer>

Is it possible to make a view which, instead of creating a new element according to a template, would use one of the three existing DOM element ?

Answer 1

The short answer is no and the long answer is irrelevant because one reason for creating templates for your view is so that you can attach a context (default is the associated controller) to it and have dynamic changes happening to the context’s property be reflected in the view. Also templates can be used in multiple places when connected to an {{outlet}}. So for your example, if “home”,”about” and “plans” are three distinct states of your application, then you would set up your templates like below:

Templates:

<script type="text/x-handlebars" data-template-name="application">
    <footer>
        <!--Your application template goes here-->
        {{outlet}}
    </footer>
</script>
<script type="text/x-handlebars" data-template-name="home">
    <!--Your home template goes here-->
</script>
<script type="text/x-handlebars" data-template-name="about">
    <!--Your about template goes here-->
</script>
<script type="text/x-handlebars" data-template-name="plans">
    <!--Your plans template goes here-->
</script>