anzeigen Bootstrap Tooltip Fokus, wenn eine Winkeleingabe einen Fehler

Question

Dieses Beispiel hat aus angularjs's docs genommen

<form name="myForm" ng-controller="Ctrl"> 
    userType: <input name="input" ng-model="userType" required> 
    <span class="error" ng-show="myForm.input.$error.required">Required!</span> 
</form> 

Ich möchte das gleiche Verhalten erreichen, aber mit einem Tooltip Bootstrap. Ich habe das Angular UI-Bootstraped-Projekt (http://angular-ui.github.io/bootstrap/) angeschaut, kann aber nicht herausfinden, wie das geht.

Etwas wie:

<input type="text" value="Click me!" 
    tooltip="See? Now click away..." 
    tooltip-trigger="focus" 
    tooltip-placement="right" 
    tooltip-enabled="myForm.input.$error.required" <--- pseudo code 
    /> 

Answer 1

ich mehrere Möglichkeiten versucht haben, sieht aus wie Sie Quellcode von Winkel Bootstrap ändern kann eine geeignete Lösung zu erhalten. Aber. Es gibt eine ‚Hacky‘ Lösung, vielleicht wird es Ihnen helfen, oder auch das ist, was man benötigt (Beispiele aus Winkeln Bootstrap und Winkel-Eingang kombiniert):

<form name="myForm" class="my-form"> 
    userType: <input style="width: 50px;" name="input" ng-model="userType" required value="Click me!" tooltip="{{myForm.$valid ? '' : 'See? Now click away...'}}" tooltip-trigger="focus" tooltip-placement="right" class="form-control"> 
    <span class="error" ng-show="myForm.input.$error.required">Required!</span><br> 
    <tt>userType = {{userType}}</tt><br> 
    <tt>myForm.input.$valid = {{myForm.input.$valid}}</tt><br> 
    <tt>myForm.input.$error = {{myForm.input.$error}}</tt><br> 
    <tt>myForm.$valid = {{myForm.$valid}}</tt><br> 
    <tt>myForm.$error.required = {{!!myForm.$error.required}}</tt><br> 
</form> 

same in plunker.

im Grunde hier einfach entfernen Text von Tooltip und es versteckt sich.