Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>The click-counter is composed of a button and a text input. There is no div that holds the 2 together. So if you are setting the width and height on the component, what are you really setting it on?</p> <pre><code>&lt;polymer-element name="click-counter"&gt; &lt;template&gt; &lt;button on-click="increment"&gt;Click Me&lt;/button&gt; &lt;p&gt;You clicked the button {{count}} times.&lt;/p&gt; &lt;/template&gt; &lt;script type="application/dart" src="click_counter.dart"&gt;&lt;/script&gt; &lt;/polymer-element&gt; </code></pre> <p>In case there would be a div wrapping the button and the text input, you could set the width of the div in the component like this:</p> <pre><code>&lt;polymer-element name="click-counter"&gt; &lt;template&gt; &lt;style type="text/css"&gt; div{ width:100px; border-style:solid; background-color: #FF9900; font-weight: bold; } &lt;/style&gt; &lt;div&gt; &lt;button on-click="increment"&gt;Click Me&lt;/button&gt; &lt;p&gt;You clicked the button {{count}} times.&lt;/p&gt; &lt;/div&gt; &lt;/template&gt; &lt;script type="application/dart" src="click_counter.dart"&gt;&lt;/script&gt; &lt;/polymer-element&gt; </code></pre> <p>You can also declare a div style on the index file, but then you have to set <code>applyAuthorStyles</code> to <code>true</code> on the component.</p> <pre><code>@CustomTag('click-counter') class ClickCounterElement extends PolymerElement with ObservableMixin { @observable int count = 0; get applyAuthorStyles =&gt; true; void increment(Event e, var detail, Node target) { count += 1; } } </code></pre> <p>This would affect all divs on the page though. I'm not sure how you would select only the root div in the click-counter component.</p>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. VO
      singulars
      1. This table or related slice is empty.
    2. VO
      singulars
      1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload