Стилизация главной розетки в Ember

У меня есть макет, который требует, чтобы основной выход был 100% от высоты страницы.

Вот JSFiddle, показывающий проблему, с которой я столкнулся. Я могу создать представление индекса и назначить ему классы css через свойство classNames, но всегда есть тот корневой div, который я не понимаю, как стилизовать.

http://jsfiddle.net/kgnQz/

Вот как выглядит тело из jsfiddle

<div id="ember153" class="ember-view"> <!-- Need style here -->
    <script id="metamorph-0-start" type="text/x-placeholder"></script>
        <div id="ember161" class="ember-view indexViewClass">
            This is the index view
        </div>
    <script id="metamorph-0-end" type="text/x-placeholder"></script>
</div>

Обычно, когда я создаю представление, я могу предоставить classaNames: ['what'] для применения CSS-классов, но как мне сделать так, чтобы основной выход был 100% страницы?

Вещи, которые я пробовал:

  1. Создание представления приложения, однако оно по-прежнему заключено в основной код выхода.
  2. Использование rootElement в Ember.Application.create({}); чтобы указать элемент стиля, однако он просто вставляет дочернее представление, куда попадает весь мой контент, который на 100%, и создает родительский div с той же проблемой, только на один уровень глубже.
  3. Создание представления приложения и стилизация, аналогичная стилизации IndexView.

Я пытался исследовать это, и мне сложно разобраться... есть идеи? Я, должно быть, упускаю что-то простое, потому что каждый раз, когда я что-то выясняю, я осознаю, что переоцениваю это или заставляю Эмбер что-то делать так, как это не должно было быть.

Источник

3 ответа

Решение

Вы можете использовать ApplicationView для стилизации вашего основного div...

App.ApplicationView = Ember.View.extend({
  classNames: ['test']
});

Смотрите http://jsbin.com/uxojek/5/edit

 <div id="ember156" class="ember-view test">
    <script id="metamorph-0-start" type="text/x-placeholder"></script><div       id="ember164" class="ember-view indexViewClass">
   This is the index view 
 </div><script id="metamorph-0-end" type="text/x-placeholder"></script>
 </div>
Источник

Любые альтернативы Ember.View, потому что он устарел и будет удален в Ember 2

Источник

Чтобы стилизовать главное представление приложения, вы можете предоставить свой собственный ApplicationView для использования в Ember.

App.ApplicationView = Ember.View.extend({
    classNames: ['hello-world'] 
});
Источник
Другие вопросы по тегам