I'm trying to assign height to a img using ngStyle and for that I'm calculating height with some Math operation as follows:

<div [ngSwitch]="tbNm?tbNm:'itm0'">
    <ion-list *ngFor="let vl of scrnshot;let ind=index">
      <img *ngSwitchCase="'itm'+ind" alt="Akhilesh" [ngStyle]="{'height':(parseInt(vl.names[0].hitWid.bdHt+(websitTyp(vl._id.origin)?100:0)))+'px','width':(vl.names[0].hitWid.bdWd+'px')}" [src]="vl.names[0].base64">
    </ion-list>
  </div>

But when I do run it it gives following error:

error_handler.js:51 TypeError: self.parent.parent.context.parseInt is not a function
    at DebugAppView._View_HomePage9.detectChangesInternal (HomePage.ngfactory.js:1444)
    at DebugAppView.AppView.detectChanges (view.js:272)
    at DebugAppView.detectChanges (view.js:377)
    at DebugAppView.AppView.detectContentChildrenChanges (view.js:290)
    at DebugAppView._View_HomePage8.detectChangesInternal (HomePage.ngfactory.js:1407)
    at DebugAppView.AppView.detectChanges (view.js:272)
    at DebugAppView.detectChanges (view.js:377)
    at DebugAppView.AppView.detectContentChildrenChanges (view.js:290)
    at DebugAppView._View_HomePage0.detectChangesInternal (HomePage.ngfactory.js:270)
    at DebugAppView.AppView.detectChanges (view.js:272)

I'm trying to assign height to a img using ngStyle and for that I'm calculating height with some Math operation as follows:

<div [ngSwitch]="tbNm?tbNm:'itm0'">
    <ion-list *ngFor="let vl of scrnshot;let ind=index">
      <img *ngSwitchCase="'itm'+ind" alt="Akhilesh" [ngStyle]="{'height':(parseInt(vl.names[0].hitWid.bdHt+(websitTyp(vl._id.origin)?100:0)))+'px','width':(vl.names[0].hitWid.bdWd+'px')}" [src]="vl.names[0].base64">
    </ion-list>
  </div>

But when I do run it it gives following error:

error_handler.js:51 TypeError: self.parent.parent.context.parseInt is not a function
    at DebugAppView._View_HomePage9.detectChangesInternal (HomePage.ngfactory.js:1444)
    at DebugAppView.AppView.detectChanges (view.js:272)
    at DebugAppView.detectChanges (view.js:377)
    at DebugAppView.AppView.detectContentChildrenChanges (view.js:290)
    at DebugAppView._View_HomePage8.detectChangesInternal (HomePage.ngfactory.js:1407)
    at DebugAppView.AppView.detectChanges (view.js:272)
    at DebugAppView.detectChanges (view.js:377)
    at DebugAppView.AppView.detectContentChildrenChanges (view.js:290)
    at DebugAppView._View_HomePage0.detectChangesInternal (HomePage.ngfactory.js:270)
    at DebugAppView.AppView.detectChanges (view.js:272)

• javascript
• angular

1 Answer 1

Per documentation:

Perhaps more surprising, template expressions cannot refer to anything in the global namespace. They can’t refer to window or document. They can’t call console.log or Math.max. They are restricted to referencing members of the expression context.

https://angular.io/docs/ts/latest/guide/template-syntax.html

You can work around it like:

class Component {
  myParseInt = parseInt;
}

html

[ngStyle]="{'height':(myParseInt (...