CODEWITHSUNDEEP
javascriptember.js
Dan
Dan

Reputation: 1596

Excess <div> and <script> tags in front-end for EmberJS app

I'm working on the front-end of an EmberJS App. Ember spits out a lot of <script> and <div> tags that can make styling and de-bugging particularly tricky for front-end development.

For example a simple list of items can sometimes have 2 <script> tags before and after every <li> and multiple <div> tags within the <li>.

Working with the developer I understand the necessity of these, however it makes doing simple tasks like :last-child, 100% height <div>'s and simple de-bugging in the Chrome Inspector very tricky. These are just some examples.

How are other developers working around this? Are there any solutions available to make the front-end work a little easier?

Upvotes: 2

Views: 218

Answers (1)

Mike Aski
Mike Aski

Reputation: 9236

Those tags are needed by ember to maintain DOM.

Nevertheless, for collections rendering, you can use {{view Ember.CollectionView ...}} instead of {{#each}} helper to avoid items associated <script> tags (see doc here).

In others cases, there is no real alternative. Maybe {{unbound}} for placeholder which do not have to be bound...

Upvotes: 3

Related Questions