{{!}} appears as a pipe in both the source and visual editors. {{!|foo}} displays as a pipe in VisualEditor but when the page is saved (or previewed from the source editor) it transcludes the actual content of Template:!, which is a soft redirect notice. This is misleading; VisualEditor also allows parameters to be set on {{!}} as though it were a normal template, and the user is unlikely to be aware of the problem until they have saved the page.
{{!}} should be treated specially by VisualEditor; the user should probably be told in some way that it isn't a template, and they definitely shouldn't be allowed to set parameters on it. If there are parameters set on it when the editor is opened, then VisualEditor should not misleadingly display a pipe.
NB: this is all observed while editing the English Wikipedia, although I presume this doesn't make much difference.