如何在Dart中使用数据绑定禁用按钮？

Question

在对类似问题的回答中,这已经超过一年了,我读到了在Dart(和聚合物 - 飞镖)中使用数据绑定禁用按钮的简单方法.

我当前的代码如下所示:

HTML:

...
<button id="btnPointDown" on-click="{{decrement}}" disabled="{{points == 0}}">\/</button>
...

.dart:

...
@published int points = 0;

void increment() {
  points++;
}

void decrement() {
  points--;
}
...

然而Dart似乎不再对残疾元素"聪明"了.

如何使用最新的Dart和Polymer来禁用使用数据绑定的按钮(或者如果不可能以编程方式)？

Answer 1

绑定到disabled属性可以这样做:

<button ... disabled?="{{ points == 0 }}">Content</button>

这?是Polymer引入的特殊语法,用于支持绑定到这种布尔属性.

这不起作用:

<button ... disabled="{{ points == 0 }}">Content</button>

因为它会导致

<button ... disabled="false">Content</button>

这仍然会禁用按钮.

对于Polymer> = 1.0,要使用的新语法是:

<button ... disabled$="{{value}}">Content</button>

注意:value已经必须是一个布尔值,正如Marco指出的那样.否则你必须创建一个将返回的函数points == 0.请参阅此处的数据绑定文档和此处的迁移指南以供参考.

问候,罗伯特

Answer 2

因为polymer 1.0我在这里找到了答案.

它应该是: <button ... disabled$="{{myTestFunction()}}">Content</button>

仅供参考:我无法使用简单的语句points == 0,但我必须使用一个返回a的函数boolean.