angularjs - Angular 2: Pass a function to the ngClass tag on the template -

i have done searching on haven't come across works.

when pass function ngstyle following error:

expression 'getclass()' in productview has changed after checked.

my template looks like:

<div class="itemcontainer">     <div class="well imageholder" [ngclass]="getclass()">         <img [src]="'img/thumbs/' + item.images[0]" class="productimage" id="productimage">     </div> </div>  

im not sure fix or if can done. have noticed error occurs ngstyle.

all appreciated.

a property binding uses following syntax: [someproperty]="an angular template expression".

in case, template expression function (rather, than, say, component property). that's fine. according "expression guidelines" section of template syntax dev guide, expressions must "idempotent". means if the

expression returns string or number, returns same string or number when called twice in row. if expression returns object (including date or array), returns same object reference when called twice in row.

since didn't provide code getclass() function, we'll assume violating idempotent rule. (you return new array or new object each time.)

in development mode (which default mode), change detection runs twice, , catch idempotent violations.

to fix this, return same array or object reference (but can modify array contents or object properties/values). e.g.,

export class mycomponent {    anarray = [];    getclass() {       // manipulate (don't reassign) anarray here, , return       return this.anarray;    } }