上聚焦顯示工具提示自舉時的角度輸入有錯誤

此示例來自angularjs's docs 上聚焦顯示工具提示自舉時的角度輸入有錯誤

<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>

我想達到相同的行爲，但與引導工具提示作出。我已經看過了Angular UI-Bootstraped項目（http://angular-ui.github.io/bootstrap/），但無法弄清楚如何做到這一點。

喜歡的東西：

<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 
    />

來源

2013-08-07 Cotten

看看是否有幫助：「[在自定義事件上啓用angular-ui工具提示]（http://stackoverflow.com/questions/16651227/enable-angular-ui-tooltip-on-custom-events/16653079#16653079）」。 – Stewie

我嘗試了幾種方法，看起來像你只能從角引導修改源代碼來獲得妥善解決。但。有一個「哈克」的解決方案，也許它會幫助你，甚至這就是你需要的東西（從角引導和角輸入組合例）：

<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.

基本上在這裏你只是刪除來自工具提示的文本並隱藏。

來源

2014-10-15 14:40:28 Rasalom

正確答案。這非常聰明。幾乎是一個黑客:-)謝謝！ –

上聚焦顯示工具提示自舉時的角度輸入有錯誤

回答

相關問題