title: Change button text dynamically in AngularJs
body: <p>I am working with AngularJS, CSS and HTML.</p>
  
  <p>Here's what I'm trying to do:
  A button gets disabled based on the output of a certain function <code>isPublished()</code>. I need the hover text over the button like When the button is disabled the hover over text could be "<code>I'm disabled</code>" and when it is not disabled the hover over text could be "<code>I'm not disabled</code>".</p>
  
  <p>Code:</p>
  
  <pre><code>&lt;span&gt;
  &lt;input title="Im disabled" type="button" class="btn btn-primary" 
          value="Publish" ng-click="publishFingerPrint()" ng-hide="isEdit"
          ng-disabled="isPublished()"/&gt;
  &lt;/span&gt;
  
  &lt;script&gt;
  $(function () {
      $(".btn btn-primary:ng-disabled").wrap(function() {
          return '&lt;span title="' + $(this).attr('title') + '" /&gt;';
      });
  });
  &lt;/script&gt;
  </code></pre>
  
  <p>With the above code, I get the hover text on the button (when disabled and when not disabled). But the problem is that the text is the same = <code>Im not disabled</code>. I need 2 different texts. Also I tried ng-mouseover but for some reason it is not working so I went with title attribute.</p>
  
  <p>Can anyone help me out with this? Any help is appreciated!
  Thanks!</p>