Question: I am working with AngularJS, CSS and HTML.

Here's what I'm trying to do:
A button gets disabled based on the output of a certain function `isPublished()`. I need the hover text over the button like When the button is disabled the hover over text could be "`I'm disabled`" and when it is not disabled the hover over text could be "`I'm not disabled`".

Code:

```
<span>
<input title="Im disabled" type="button" class="btn btn-primary" 
        value="Publish" ng-click="publishFingerPrint()" ng-hide="isEdit"
        ng-disabled="isPublished()"/>
</span>

<script>
$(function () {
    $(".btn btn-primary:ng-disabled").wrap(function() {
        return '<span title="' + $(this).attr('title') + '" />';
    });
});
</script>

```

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 = `Im not disabled`. I need 2 different texts. Also I tried ng-mouseover but for some reason it is not working so I went with title attribute.

Can anyone help me out with this? Any help is appreciated!
Thanks!

Answer: 
It seems that you want to change the title (hover title) dynamically or on some action, that can be done specificying title attribute as `ng-attr-title="{{ message }}"` 

You can change the title in your `ngDisabled` function.

```
$scope.isPublished = function(){
   $scope.message = "I'm disalbed";
}

```

```js
var app = angular.module('myApp', []);
function ctrl($scope) {
    $scope.message = "Old Title";
    $scope.changeTitle = function(){
      $scope.message = "New Title";
    };
}
```

```html
<script src="http://code.angularjs.org/1.2.23/angular.min.js"></script>
<div ng-app="myApp" ng-controller="ctrl">
    <div ng-attr-title="{{ message }}">Hover me</div>
    <br/><br/>
    {{message}}
    <button ng-click="changeTitle()">Change Hover Title</button>
</div>
```
You can try something like this.

```
<body ng-app="app" ng-controller="ctr">
       <button type="button" class="btn btn-primary" ng-click="disable = !disable;changeTitle();">Click</button>
       <input title="{{title}}" type="button" class="btn btn-primary" value="Publish"  ng-disabled="disable"/>
      <script>
        angular.module('app',[]).controller('ctr',function($scope){
          $scope.changeTitle = function(){
            $scope.title = $scope.disable ? 'I m disabled' : 'I m not disabled';
          }
        })
      </script>
  </body>

```

Have a look into working [plunker](https://plnkr.co/edit/zsUxxz8d4ufyzHW6A7th?p=preview).