code: function mergeTemplateAttributes(dst, src) {
        var srcAttr = src.$attr,
            dstAttr = dst.$attr,
            $element = dst.$$element;
  
        // reapply the old attributes to the new element
        forEach(dst, function(value, key) {
          if (key.charAt(0) != '$') {
            if (src[key] && src[key] !== value) {
              value += (key === 'style' ? ';' : ' ') + src[key];
            }
            dst.$set(key, value, true, srcAttr[key]);
          }
        });
  
        // copy the new attributes on the old attrs object
        forEach(src, function(value, key) {
          if (key == 'class') {
            safeAddClass($element, value);
            dst['class'] = (dst['class'] ? dst['class'] + ' ' : '') + value;
          } else if (key == 'style') {
            $element.attr('style', $element.attr('style') + ';' + value);
            dst['style'] = (dst['style'] ? dst['style'] + ';' : '') + value;
            // `dst` will never contain hasOwnProperty as DOM parser won't let it.
            // You will get an "InvalidCharacterError: DOM Exception 5" error if you
            // have an attribute like "has-own-property" or "data-has-own-property", etc.
          } else if (key.charAt(0) != '$' && !dst.hasOwnProperty(key)) {
            dst[key] = value;
            dstAttr[key] = srcAttr[key];
          }
        });
      }
docs: When the element is replaced with HTML template then the new attributes
  on the template need to be merged with the existing attributes in the DOM.
  The desired effect is to have both of the attributes present.
  
  @param {object} dst destination attributes (original DOM)
  @param {object} src source attributes (from the directive template)