Aurelia - 在自定義元素內重寫css綁定

Question

我想要實現的是自定義元素，並將css從父元素直接綁定到此元素，但也從自定義元素中綁定。

父：

<div> 
    <custom-element css="height: ${heightProperty}"></custom-element> 
</div> 

定製元素：

<template css="width: ${widthProperty}"> 
</template> 

但是width和height屬性不會在同一時間被綁定。只有最後綁定（更改）的纔會生效。但設置類屬性時合併似乎工作。那麼這個錯誤還是打算？

Answer 1

不知道這是去這樣做的/有道的樣子，但是當你一個綁定的CSS屬性添加到您的自定義元素會發生什麼？

像這樣：

import { bindable } from 'aurelia-framework'; 
export class customElement { 
    @bindable() 
    css = ''; 
} 

，然後在你的HTML

<template css="width: ${widthProperty} ${css}"> 
</template>