CODEWITHSUNDEEP
ember.jshandlebars.js
trivektor
trivektor

Reputation: 5638

Ember JS/Handlebars view helper

Currently, if we define our view as {{#view App.myView}}, ember/handlebars will wrap the view element inside a <div id="ember-1234" class='ember-view'>.

Is there a way to stop this?

Upvotes: 5

Views: 3407

Answers (5)

Stargazer
Stargazer

Reputation: 542

You probably want to set tagName as ''.

App.MyView = Em.View.extend({
    tagName: ''
});

At least it stops wrapping inner contents.

Upvotes: 11

pangratz
pangratz

Reputation: 16153

If I understand you correctly you want to achieve something like jQuery's replaceWith? You can use this in Ember.js when my Pull Request gets merged: https://github.com/emberjs/ember.js/pull/574.

Also have a look at Create Ember View from a jQuery object

Upvotes: 0

dogawaf
dogawaf

Reputation: 370

I usually think my views as wrapper. For example, if the initial given html code is :

<div class="item"><p>my stuff></p></div>

Then I create a view with a tagName property as "div" (which is default), and classNames property as "item". This will render, with proper handlebars template :

{#view App.myView}
    <p>my stuff></p>
{/view}

-> render as

<div id="ember-1234" class="ember-view item">
    <p>my stuff></p>
</div>

Then if you need to have your proper ID on this div, you could define the "elementId" property on your view class (before create()). (@see source code)

Upvotes: 2

Mike Aski
Mike Aski

Reputation: 9236

If you want to customize view element's id, you can use:

{{#view App.myView id="my-id"}}

Upvotes: 2

Mike Aski
Mike Aski

Reputation: 9236

I assume you are talking about the 'ember-view' class which is not customizable (element type being customizable thanks to the tagName attribute...).

Actually, Ember later uses this class to register (once!) an event listener on the document in order to dispatch events to the JS view.

I don't mind it would be that simpler to avoid using this class. There would have to find another way to select all ember's controlled element, but I have no idea how.

See source, @ line 117.

Upvotes: 1

Related Questions