显示在angularjs输入验证酥料饼 [英] show popover on input validation in angularjs

问题描述

我想要做输入验证在angularjs。通过展示一个引导酥料饼（ https://angular-ui.github.io/bootstrap/# /它酥料饼）时失效。我无法弄清楚如何触发酥料饼。

i want to do input validation in angularjs. By showing a bootstrap popover(https://angular-ui.github.io/bootstrap/#/popover) on it when invalid. I cannot figure out how to trigger the popover.

 User name:
   <input type="text" name="userName" ng-model="user.name" popover="m here"  popover-trigger="myForm.userName.$error.required" required>

在[plunker]： http://plnkr.co/edit/PwgquZXzhacvyeKeBc2O？ p = preVIEW

推荐答案

要使用自定义的条件已使用$ tooltipProvider触发酥料饼

To trigger a popover using custom conditions you have to use the $tooltipProvider

在默认情况下，你可以触发酥料饼只为：的mouseenter，鼠标离开，单击，焦点，模糊

By default you can trigger the popover only for : mouseenter, mouseleave, click, focus,blur

所以，你必须定义自定义触发，像这里显示： HTTP ：？//plnkr.co/edit/0wEqzz p = preVIEW

So you have to define your custom triggers, something like what is shown here : http://plnkr.co/edit/0wEqzz?p=preview

 angular.module('myApp',['ui.bootstrap'])
  .config(['$tooltipProvider', function($tooltipProvider){
    $tooltipProvider.setTriggers({'customEvent': 'customEvent'});
 }]);

angular.module('myApp').controller('myController', ['$scope','$timeout',
  function($scope, $timeout) {
    $scope.fireCustomEvent = function() {
    $timeout(function() {
      $('#tooltipTarget').trigger('customEvent');
    }, 0);
}
}]);

这篇关于显示在angularjs输入验证酥料饼的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！