Angular Directive Does Not Update As Scope Updates

I'm puzzled by the apparent failure of my directive to update whenever its scope updates. I want to add up the characters in 3 different form fields, subtract that length from 29 (

Solution 1:

link is only run once, during the initial directive link phase.

There's several ways to do this though: Have a function on the scope called remainingChars(), and return the correct amount there. Then in your template have {{remainingChars()}}

Second, you could have a watch expression:

$scope.$watch(function() {
  // watch expression, fires the second function on changereturn transaction.checkNumber.length - transaction.depositnote.length}, function() {
  //update the remainingchars value here in the second function
})

Or third, have some kind of ng-change event handler which updates the remainingchars variable.

ng-change="calcRemanining()"