aurelia - bind to css visibility -


using aurelia's css bind have use syntax

<div css.bind="{visibility: somefield ? 'visible':'hidden'}"> 

is there more succinct way this?

please note, using show.bind not i'm after equivalent display:none , want visibility:hidden (so element takes space not visible)

something ideal

<div visibility.bind="somefield"> 

a little simpler syntax be:

<div css=“visibility: ${somefield ? 'visible':'hidden'}”> 

to make more succinct, can create custom attribute:

import {inject} 'aurelia-framework';  @inject(element) export class visibilitycustomattribute {     constructor(element) {         this.element = element;     }      valuechanged(newvalue) {         this.element.style.visibility = newvalue ? 'visible' : 'hidden';     } } 

and use this:

<template>   <require from='./visibility-custom-attribute'></require>   <div visibility.bind="somefield"> </template> 

see this gistrun example.


Comments

Popular posts from this blog

python - Operations inside variables -

Generic Map Parameter java -

arrays - What causes a java.lang.ArrayIndexOutOfBoundsException and how do I prevent it? -