如何在Polymer 1.0中的html中修改布尔属性值？

Question

如果将布尔属性分配给组件，如何在html中修改布尔值，而无需在javascript中创建任何函数？

例如，假设我具有以下组件：

 Polymer({ is: 'find-retailer-map', properties: { fixedPosition: { type: Boolean, notify: true, }, }, }); 

 <dom-module id="osb-retailer-page"> <template> <find-retailer-map fixed-position></find-retailer-map> </template> </dom-module> 

如何在html中使fixed-position正确或错误？

谢谢

Answer 1

布尔属性像HTML中的常规布尔属性一样，例如：

<input type="checkbox" checked />
<input type="text" disabled />

要打开/关闭，您需要删除或添加属性，然后

• 开启： <find-retailer-map fixed-position></find-retailer-map>
• 关闭： <find-retailer-map></find-retailer-map>

以编程方式打开/关闭：

• 打开： <find-retailer-map fixed-position$="{{_your_toggle(true)}}"></find-retailer-map>
• 关闭： <find-retailer-map fixed-position$="{{_your_toggle(false)}}"></find-retailer-map>

希望能有所帮助

Answer 2

HTML和Polymer中的布尔值的作用相同。 它们要么在（true），要么不在（false）。 这三个人在做同一件事...

<find-retailer-map fixed-position></find-retailer-map>
<find-retailer-map fixed-position="true"></find-retailer-map>
<find-retailer-map fixed-position="false"></find-retailer-map>

...因为您可以在fixed-position属性中传递任何内容以将其设置为true。 要将其设置为false，则需要删除该属性。

<find-retailer-map></find-retailer-map>

如果要动态设置属性，请将变量作为属性从osb-retailer-page传递到find-retailer映射中。

<dom-module id="osb-retailer-page">
  <template>
    <find-retailer-map fixed-position="[[aVariableInRetailerPage]]"></find-retailer-map>
  </template>
</dom-module>

但是，find-retailer-map中的fixedPosition属性的默认值必须为false（或未设置，就像您的示例一样）。 如果该属性默认为true，则无法更改。

根据属性的存在来设置布尔属性：如果属性完全存在，则将属性设置为true，而与属性值无关。 如果该属性不存在，则该属性将获得其默认值。 /.../要使布尔属性可通过标记配置，则必须默认为false。 如果默认设置为true，则无法从标记将其设置为false，因为属性的存在（带有或不带有值）都等于true。 这是Web平台中属性的标准行为。

https://www.polymer-project.org/1.0/docs/devguide/properties