Showing popup according to the header nav link
this.hide = function () {

    this.show = false;


  }

  this.showIt = function () {

    this.show = true;

  }



You have extraneous lines everywhere, and extraneous space everywhere, trim it down.

this.hide   = function(){ this.show = false; }
this.showIt = function(){ this.show = true;  }




On the other hand, here, you're missing space (but also have extra space):


  this.setCategory = function ( category ) {

     return this.showPath = category+'.html'
                                   ^^^
  }



should be:

this.setCategory = function(category){ this.showPath = category + '.html'; }


The return is redundant, as the value goes nowhere in showCategory.




     element.on('click', '.edit', function () {
        modalService.showIt();
        modalService.showCategory('edit');
     });

     element.on('click', '.service', function () {
       modalService.showIt();
       modalService.showCategory('service');



This is redundant, pass the .service / .edit in as a variable.