Since, unlike single selects, multiple selects generate the placeholder in an input tag, the placeholder is not escaped by the escapeMarkup therefore you cannot add an icon to it. this is, by the way, a huge pain.
I wonder if this is a bug or it has a workaround.
You can use the templateSelection callback to define the HTML format of your selected items in a multi-select Select2 widget.
Please note this statement:
If you need to render HTML with your selection template, you must wrap your rendered selection in a jQuery object. In this case, the selection will be passed directly to
jQuery.fn.appendand will be handled directly by jQuery. Any markup, such as HTML, will not be escaped and it is up to you to escape any malicious input provided by users.
In other words, you can’t simply return a string containing HTML from your templateSelection callback; instead, you must pass that string to jQuery and return the resulting object; e.g., return $('<div><img src="my-icon.png"> ' + item.text + '</div>');
I understand this would work to add an icon to a selection, but does it work for an icon to the placeholder???
According to the documentation, yes. You have to recognize the placeholder text in your templating function, but you should be able to style it.