Multiple attributes in ng-style

css angularjs ng-style
TrtG picture TrtG · Apr 3, 2015 · Viewed 50.7k times · Source

I need to have multiple raw style attributes like :

$scope.css = "'width': 'calc(100% - "+$scope.fixedColumnsWidth+"'),'margin-left':'"+ $scope.fixedColumnsWidth+"'";

<div ng-style="{css}">

This is not working. It works when I use

<div style="{{css}}">

But not for IE.

Answer

Pankaj Parkar picture Pankaj Parkar · Apr 3, 2015

Use below on view

<div ng-style="{
   'width': calc('100% -'+fixedColumnsWidth),
   'margin-left': fixedColumnsWidth}">

Related questions

How to set div width using ng-style

I am trying to set the div width dynamically using ng-style but it is not applying the style. Here is the code: <div style="width: 100%;" id="container_fform" ng-controller="custController"> <div style="width: 250px;overflow: scroll;"> &…

Read More
How to get multi css rule for ng-style by function?

I need for apply multi css rule to html tag in angular form template. <div class="form-control" id="data.objectStyle" ng-model="data.type" ng-style="getStyle(data.objectStyle)"> {{data.objectStyle.title}} </div> getStyle function in controller : $scope.…

Read More
How to change a CSS property dynamically in AngularJS

Right now I have a background image URL hard-coded into CSS. I'd like to dynamically choose a background image using logic in AngularJS. Here is what I currently have: HTML <div class="offer-detail-image-div"><div> CSS .offer-detail-image-div { …

Read More