Appcelerator - Hide UI element in list generated by dataCollection -

i using alloy , alloy collections generate list of views in app. need able hide child elements within each view based on data within model object.

for example have alloy view:

<view datacollection="$.collectionofstuff">     <label>always visible</label>     <label>only show when {isvisible} true</label>     <label>another label visible</label> </view> 

assuming models in $.collectionofstuff has isvisible property, able hide second label based on value. setting visible property on label easy enough hides element , doesn't reclaim space - meaning there gap between first , third label. need second label stop taking space well.

i have tried using data binding syntax add hidden class element (<label class="{hiddenwhennotvisible}">) alloy doesn't appear resolve data binding tags in class attributes.

this doesn't seem should difficult i'm hoping i'm missing obvious.

you can use visible property so:

<label visible="{isvisible}"/> 

or using datatransform set width 0 , don't ocuppy space on ui

in view

<view datacollection="$.collectionofstuff" datatransform="transformmodel">     <label>always visible</label>     <label width="{width}">only show when {isvisible} true</label>     <label>another label visible</label> </view> 

in controller

function transformmodel(model){     var data = model.tojson();     data.width = !data.isvisible ? 0 : 50;     return data; }