Make databound input textbox updateable with AngularJS
<p>I have a form with a bunch of labels and textboxes, my controller retrieves data and displays it in those controls:</p>

<pre><code> &lt;label&gt;ID: {{pageData.ID}}&lt;/label&gt;&lt;br/&gt;
 &lt;label&gt;Title: {{pageData.title}}&lt;/label&gt;&lt;/br&gt;
 &lt;input type="text" name="notes" placeholder="Notes" value="{{pageData.notes}}" /&gt;

 &lt;input type="button" name="btnProcess" class="action-button" value="Process" ng-click="Process()" /&gt;
</code></pre>

<p>The display of the data works fine, but <code>notes</code> field is optional and in most cases is empty. I want to update the field ona  button-click. </p>

<p>Here is the code from my controller that pulls data into <code>PageData</code>:</p>

<pre><code>$http.get(window.baseApiUrl + '/GetPageData').
        then(function (result) {             
            $scope.pageData = result.data;
        });
</code></pre>

<p>Now the issue is that for grabbing the value of <code>notes</code> textbox from my controller, I need <code>ng-model</code> but if I add <code>ng-model</code> to my textbox, I no longer able to see the values from the database for those records that do have notes. </p>

<p>Is there a workaround?</p>