Angular directives and controller functions

Question

I'm using a ngRepeat div. Inside this div I'm assigning to directives such as ngClick, ngStyle and just expressions functions which belong to the controller. Example:

<div ngStyle = "myCtrl.divStyle(key)"> ... </div>

When I'm updating the model this functions will not be called of course. How to force angular to call those functions. Is it a bad practice to do so?

Answer 1

As per the documentation , the style is bound to the model. Changing the model will cause an update in the view.

<input type="button" value="set color" ng-click="myStyle={color:'red'}">
<span ng-style="myStyle">Sample Text</span>

And you can check out this plunker for a working example.

Answer 2

https://docs.angularjs.org/api/ng/directive/ngStyle

It is not clear what you are trying to do, but i think you can use pass a controller variable exposed via $scope .eg $scope.style to css style then on ngClick, change the value of $scope.style, if you want to use css class instead of inline styling, try ng-class.