Not able to create border dynmaically using ngstyle in angularjs

Question

I have applied this condition on element but it is not showing any border also it is not showing any error in parsing html:

<h1 ng-style="'{border:' + f()+'px' + 'solid red'+'}'">{{a}}</h1>

Here is the code from my controller:

$scope.a = "dynamic border";
$scope.f = function() {
  return 1;
};

Answer 1

Your code is mostly correct, only small issues with placement of '. Try the following please.

<h1 ng-style="{'border': f() + 'px solid red'}">{{a}}</h1>

Demo