md-autocomplete.decorator.js

(function() {
  'use strict';
  
  angular.module('app.core')
  .config(config);
  
  config.$inject = ['$provide'];
  
  function config($provide) {
    mdAutocompleteDirectiveDecorator.$inject = ['$delegate', '$timeout'];
    
    $provide.decorator('mdAutocompleteDirective', mdAutocompleteDirectiveDecorator);
    
    function mdAutocompleteDirectiveDecorator($delegate, $timeout) {
      var directive = $delegate[0],
      compile = directive.compile;
      
      
      // Extend compile function
      directive.compile = function(tElement) {
        
        // Run the original compile function
        var link = compile.apply(this, arguments);
        
        // Return new link function
        return function(scope, element, attrs, ctrls) {
          
          // Don't do anything if not placeholder
          if(!scope.placeholder) return link;
          
          // Run the original link function
          link.apply(this, arguments);
          
          /*
          Wrap code within $timeout to force the excecution to be made
          after ngIf runs
          
          Without this walkaround inputContainer
          and input elements doesn't exists yet in DOM
          */
          $timeout(function() {
            var
            inputContainer = element.find('md-input-container'),
            input = inputContainer.find('input');
            
            // Show the placeholder and send the label away
            inputContainer.toggleClass('md-input-has-placeholder');
            input.attr('placeholder',scope.placeholder);
          });
        }
      }
      
      return $delegate;
    }
  }
})();