Как я могу переключить класс с использованием логического элемента в шаблоне Polymer?

Question

Хотел бы достичь этого без с помощью вспомогательной функции, как показано на рисунке here. Я знаю, что могу использовать некоторые базовые операторы (т. Е. !), но хотел бы использовать немного больше логики в шаблонах. В основном цель состоит в том, чтобы использовать логическое значение, заданное с помощью iron-media-query, для переключения класса на элемент.

псевдокоде:

<div class$="[[(mobile)?'mobile-styling':null]]"></div> 

P.S. имя класса не может быть именем переменной boolean.

Благодаря

Answer 1

К сожалению, эта функция устарела для повышения производительности. полимер 1.0+ поддерживают только следующее:

1. Путь к собственности или подпроцессу (пользователи, адрес.стрэйт).
2. Вычисленное связывание (_computeName (firstName, lastName, locale)).
3. Любое из вышеперечисленных, которым предшествует оператор отрицания (!).

вот пример того, как можно достичь вычислено связывание:

<dom-module ...> 
    <template> 
    <div class$="[[hasMobileStyle(mobile)]]"></div> 
    </template> 
    <script> 
    Polymer({ 
     ... 
     hasMobileStyle: function(mobile) { 
     return mobile ? 'mobile-styling' : ''; 
     } 
    }); 
    <script> 
</dom-module> 

вы можете также использовать логическое значение в качестве селектора, чтобы избавиться от вычисленного связывания:

<div class$="mobile-styling--[[mobile]]"></div> 

и вы сделали бы селектор на .mobile-styling--true

То, что вы просите, не может быть сделано. работают только три условия: [[(mobile)?'mobile-styling':null]] не соответствует критериям.