Div contenteditable with ng-pattern

Question

I looked around the internet and couldn't find a solution to this. I don't see it in the angular documentation so this may not even be possible at all.

I was wondering if we can get ng-pattern and .ng-invalid-pattern working with "div" contenteditable?

 .test.ng-invalid-pattern {
      border:1px solid #f00;
    }

 <div  class="test" contenteditable="true" ng-model="usd" pattern="^-?\d+(\.\d+)?$"> {{usd}} </div>

Plunker: http://plnkr.co/edit/nihh9H?p=preview

edited; I got it to work in plunker, however, I coudln't get it to work in my app.

Which leads to the following questions:

1. When it first load, it sees an error because the viewValue is {{usd}}. Is there a way to fix that?
2. In my app, its basically the same thing as my plunker, but i keep getting ngModel.$valid = false. Is there a way i can tell WHAT is causing it to fail??

Thanks and Regards, Kev