title: How to display angular form validation error inside angular bootstrap popover?
body: <p>I am new to angular js. I want to show the form error in angular bootstrap popover at the right hand side of the element.I tried to create the directive and I got an element when it changes classes. But I don't have an idea how to move next.</p>
  
  <pre><code>(function(angular) {
    'use strict';
  var app=angular.module('formExample', [])
    .controller('ExampleController', ['$scope', function($scope) {
      $scope.master = {};
  
      $scope.update = function(user) {
        $scope.master = angular.copy(user);
      };
  
      $scope.reset = function(form) {
        if (form) {
          form.$setPristine();
          form.$setUntouched();
        }
        $scope.user = angular.copy($scope.master);
      };
  
      $scope.reset();
    }]);
  app.directive("alert", function(){
      return {
          restrict: 'C',
          priority: -1000,
          link: function(scope, ele, attrs, ctrl){
            scope.$watch(function() {console.log(ele.attr('class')); })
            if (ctrl) {
              console.log("applying custom behaviour to input: ", ele.attr('id'));
              // ... awesomeness here
            }
          }
      };
  });
  })(window.angular);
  </code></pre>
  
  <p>I just want to show the error message </p>
  
  <ol>
  <li><strike>when user clicks save button(all form fields error message)</strike></li>
  <li><strike>blur of an element(only for the element which is lost the focus)</strike></li>
  </ol>
  
  <p>Here is my <a href="https://plnkr.co/edit/xaIQqiIFsd6yZDWFZeWh?p=preview" rel="noreferrer">plnkr</a> which I tried to get the message. </p>
  
  <p><strong>Update</strong> </p>
  
  <p>Somehow I displayed the angular bootstrap popover and close button which closes the popover. </p>
  
  <p>I have two issues in the current <a href="https://plnkr.co/edit/F34YgDyY1cDMp5ZLAN6P?p=preview" rel="noreferrer">plunker</a>.</p>
  
  <ol>
  <li>I want to display the error message inside my popover template
  respective to the element where it is getting opened. I need this
  template because I need a close button.</li>
  <li>Once I closed the popover if the field is empty and user clicks
  submit the popover is not opening next time. I want to display error
  message each and every time of submit.</li>
  </ol>