Use Exclamation Point as First Character with AngularJS Filter
<p>I'm filtering a list of objects in AngularJS using ng-repeat:</p>

<pre><code>&lt;tr ng-repeat="application in page.applications | filter: {DisplayName:page.ApplicationSearchValue}"&gt;
    {{application.DisplayName}}
&lt;/tr&gt;
</code></pre>

<p>If the user puts an exclamation point as the first character in the search box, then Angular interprets that as a negation symbol. So <code>!MyApplication</code> returns all the applications except for MyAppliction.</p>

<p>I tried using a custom function as description in <a href="https://docs.angularjs.org/api/ng/filter/filter" rel="nofollow noreferrer">the Angular documentation for filter</a>, but the exclamation point never finds its way into the function.</p>

<p>I found that the code is going through the following function in the <a href="https://code.angularjs.org/1.5.5/angular.js" rel="nofollow noreferrer">AngularJS source code</a>, which is basically enforcing that the exclamation point gets special treatment:</p>

<pre><code>function deepCompare(actual, expected, comparator, matchAgainstAnyProp, dontMatchWholeObject) {
  var actualType = getTypeForFilter(actual);
  var expectedType = getTypeForFilter(expected);

  if ((expectedType === 'string') &amp;&amp; (expected.charAt(0) === '!')) {
    return !deepCompare(actual, expected.substring(1), comparator, matchAgainstAnyProp);

      .....
</code></pre>

<p>My current "solution" is to change the filter object to:</p>

<pre><code>filter: {DisplayName:(page.ApplicationSearchValue.indexOf('!') == 0 ? page.ApplicationSearchValue.substring(1) : page.ApplicationSearchValue)}
</code></pre>

<p>But it's only a matter of time until QA figures out that the problem would still occur if someone started the search box with <code>!!</code>.</p>

<p>Is there a common pattern for dealing with this situation?</p>