CODEWITHSUNDEEP
cssangularjs
Coding Duchess
Coding Duchess

Reputation: 6899

Cannot apply CSS in angular applicaton

For some reason I cannot apply css to my image in angular app. i have tried:

<img ng-src="Images/{{Type.TypeImg}}" ng-click="GoNext(Type.TypeId)" ng-style="zoneicon" />

and

<img ng-src="Images/{{Type.TypeImg}}" ng-click="GoNext(Type.TypeId)" ng-style="border: 1px solid blue;" />

but neither worked

Upvotes: 1

Views: 75

Answers (2)

abidibo
abidibo

Reputation: 4287

What about

<img ng-src="Images/{{Type.TypeImg}}" ng-click="GoNext(Type.TypeId)" ng-style="{'border': '1px solid blue'}" />

ng-style takes a dictionary (js object) instead of string.

So in the first example zoneicon must evaluate to an object

Upvotes: 2

Ruan Mendes
Ruan Mendes

Reputation: 92274

If the style is not dynamic, you can just use the regular style/class attributes. See http://jsfiddle.net/mendesjuan/HB7LU/23212/

var myApp = angular.module('myApp', []);


function MyCtrl($scope) {
  $scope.name = 'Superhero';
}

.some {
    background-color: #aaa;
}

<div ng-controller="MyCtrl" 
     style="border: 1px solid red"
     ng-style="{color: 'blue'}"
     class="some">
  Hello, {{name}}!
</div>

Upvotes: 0

Related Questions