如何通过解析index.html自定义元素中的值来设置/覆盖Lit元素typescript属性装饰器

Question

我正在尝试覆盖lit元素中的一个set属性。我使用Typescript，并在自定义元素中使用装饰器设置值，尽管当我试图通过在index.html中设置不同的属性来覆盖元素时，它不会覆盖。。。

当我console.log属性时，它只有在lit元素中设置的属性。

我在LitElement中使用mixinBehaviours、IronA11yKeysBehavior和GestureEventListeners。

当使用普通的javascript表示法时，该属性确实会覆盖，尽管如果可能的话，我更愿意保留decorator。

// TypeScript file
class Carousel extends mixinBehaviors([
IronA11yKeysBehavior,
GestureEventListeners
], LitElement) {
/**
* Carousel direction (horizontal or vertical)
*/
@property({type: String})
direction = 'horizontal';
}
// index.html
<carousel direction="vertical"></carousel>

我希望index.html中的方向可以覆盖typescript decorator属性。。。

Answer 1

您只是在设置属性，而不是属性。将属性设置为.direction。您可以在此处找到语法参考：https://lit-html.polymer-project.org/guide/writing-templates#bind-属性