<img class="img-fluid img-thumbnail" ng-src="/download/{{1027}}/{{imageModel.imageID}}/"
                    pop-over-title="{{form.tagNumber+' - '+imageModel.imageID}}" pop-over-image      />

sample.directive('popOverImage', ['$mdDialog', function($mdDialog){
    var template='<md-dialog md-selected="tabIndex" aria-label="Image Preview">'
        +'<md-toolbar><div class="md-toolbar-tools"><h2 ng-bind="title"></h2><span flex></span>'
        +'<md-button ng-click="back()" class="md-raised" style="color:red;">Previous </md-button><md-button ng-click="next()" style="color:red;" class="md-raised"> Next'
        +'</md-button><md-button class="md-icon-button" ng-click="cancel()">'
        +'<md-icon md-font-library="material-icons" aria-label="Close dialog" class="icon-static">close</md-icon></md-button></div>'
        +'</md-toolbar><md-dialog-content><img ng-src="{{imageSrc}}" alt="{{title}}" class="demo-image"></md-dialog-content></md-dialog>';
    return {
        link: function($scope, elem, attrs){
            elem.addClass('image-click');
            elem.on('click',function(){
                var imageSrc = attrs.src;
                var title = attrs.popOverTitle;
                showLightboxModal(imageSrc,title);

            });
            function showLightboxModal(imageSrc, title) {
                var confirm = $mdDialog.confirm({
                    template: template,
                    clickOutsideToClose: true,
                    controller: popOverController
                });
                $mdDialog.show(confirm);
                function popOverController($scope, $mdDialog) {
                    $scope.imageSrc = imageSrc;
                    $scope.title = title;
                    $scope.cancel = function() {
                        $mdDialog.cancel();
                    };
                     $scope.back = function() {
                         console.log("back");
                            if ($scope.tabIndex> 0) {
                              $scope.tabIndex--;
                            }
                          };
                          $scope.next = function() {
                              console.log("next");
                            if ($scope.tabIndex< 2) {
                              $scope.tabIndex++;
                            }
                          };
                }
            }
        }
    };
}]);