aurelia 有条件地添加或删除HTML元素

示例

与show.bind使用时不同，if.bind如果提供的绑定值是，则元素将从页面中删除；如果值为，则将元素false添加到页面中true。

export class MyViewModel {
    isVisible = false;
}

<template>
    <div if.bind="isVisible"><strong>If you can read this, I am still here.</strong></div>
</template>

分组元素

有时可能需要一次性添加或删除整组元素。为此，我们可以使用<template>元素来显示或隐藏其他元素，而不需要像DIV这样的占位符元素。

export class MyViewModel {
    hasErrors = false;
    errorMessage = '';
}

<template if.bind="hasErrors">
    <i class="icon error"></i>
    ${errorMessage}
</template>