EmberJS-Template View Helper

Quiz

Description

The view helper is same as the partial helper. It renders the view within the context of the current controller. The view controls what template is rendered.

Syntax

{{view "instance"}}

Example

<!DOCTYPE html>
<html>
   <head>
      <title>Emberjs View Helper</title>
      <!-- CDN's -->
      <script src="https://cdnjs.cloudflare.com/ajax/libs/handlebars.js/3.0.1/handlebars.min.js"></script>
      <script src="https://code.jquery.com/jquery-2.1.3.min.js"></script>
      <script src="https://cdnjs.cloudflare.com/ajax/libs/ember.js/1.10.0/ember.min.js"></script>
      <script src="https://builds.emberjs.com/tags/v1.10.0-beta.3/ember-template-compiler.js"></script>
      <script src="https://builds.emberjs.com/release/ember.debug.js"></script>
      <script src="https://builds.emberjs.com/beta/ember-data.js"></script>
   </head>
   <body>
      <script type="text/x-handlebars">
         <!-- rendering the template associated with "my" view -->
         {{view "my"}}
      </script>

      <!--An instance of "my" view will be created -->
      <script type="text/x-handlebars" data-template-name="my">
         <p> View: {{view.constructor}} </p>
         <p>{{view.something}}</p>
         {{controller}}
      </script>

      <script type="text/javascript">
         App = Ember.Application.create();

         App.MyView = Ember.View.extend({
            templateName: "my",
            something: "View Helper"
         });
      </script>
   </body>
</html>

Output

Let's carry out the following steps to see how above code works −

Save above code in tmp_helper_view.htm file
Open this HTML file in a browser.

Print Page