ng-pattern regex Error: [$parse:lexerr] Lexer Error
<p>I have this as my regex pattern</p>

<pre><code>(^([Aa][Ss])[0-9]{8})|(^6[0-9]{7})
</code></pre>

<p>i get console errors below, but it works!:</p>

<pre><code>libraries-c8d65edf41.js:22505 Error: [$parse:lexerr] Lexer Error: Unexpected next character  at columns 1-1 [^] in expression [(^([Aa][Ss])[0-9]{8})|(^6[0-9]{7})].
</code></pre>

<p><a href="http://errors.angularjs.org/1.5.2/" rel="nofollow">http://errors.angularjs.org/1.5.2/</a>$parse/lexerr?p0=Unexpected%20nextharacter%20&amp;p1=s%201-1%20%5B%5E%5D&amp;p2=(%5E(%5BAa%5D%5BSs%5D)%5B0-9%5D%7B8%7D)%7C(%5E6%5B0-9%5D%7B7%7D)</p>

<p>Any ideas on how to get rid of the console errors?
Thanks.</p>

<p>Here is the directive html</p>

<pre><code>&lt;div class="input"&gt;
&lt;div data-ng-class="{'input-group': label}"&gt;
    &lt;div class="input-group-addon"
        data-ng-if="label"&gt;
        {{label}}
        &lt;span class="required"
            data-ng-if="required &amp;&amp; isEditable"&gt;
            *
        &lt;/span&gt;
    &lt;/div&gt;
    &lt;div class="input-group-addon required"
        data-ng-if="!label &amp;&amp; required &amp;&amp; isEditable"&gt;
        *
    &lt;/div&gt;
    &lt;div class="form-control"
        title="{{object[key] || 'N/A'}}"
        data-ng-if="!isEditable"&gt;
        &lt;span&gt;{{object[key] || 'N/A'}}&lt;/span&gt;
    &lt;/div&gt;
    &lt;div class="form-control editable"
        title="{{object[key] || 'N/A'}}"
        data-ng-if="isEditable &amp;&amp; !isEditing"
        data-ng-click="edit()"&gt;
        &lt;span&gt;
            &lt;a href=""&gt;{{object[key] || 'N/A'}}&lt;/a&gt;
        &lt;/span&gt;
    &lt;/div&gt;
    &lt;input class="form-control"
        data-ng-if="isEditable &amp;&amp; isEditing"
        data-ng-model="model.value"
        data-ng-keydown="onKeypress($event)"
        data-ng-blur="save()"
        data-ng-pattern="regexPattern"
        name="{{inputName}}"
        data-csdp-autofocus /&gt;
&lt;/div&gt;
</code></pre>

<p></p>

<p>and here is the js for the directive</p>

<pre><code>(function (angular) {
'use strict';

angular.module('commons.directives.forms')
    .directive('exInput', InputDirective);

InputDirective.$inject = ['$q', 'commons.constants.KeyCodeConstant'];

function InputDirective ($q, KeyCodeConstant) {
    return {
        restrict: 'A',
        replace: true,
        templateUrl: 'commons/directives/forms/input.directive.html',
        link: link,
        scope: {
            input: '@exInput',
            isEditable: '=?',
            object: '=ngModelObject',
            key: '@ngModelKey',
            autofocus: '=?',
            required: '@ngRequired',
            inputName: '@inputName',
            regexPattern: '@ngPattern',
            preEditing: '&amp;',
            onEditing: '&amp;',
            onSave: '&amp;',
            onCancel: '&amp;',
            onFinally: '&amp;',
            onInit: '&amp;'
        }
    };

    function link (scope) {
        scope.edit = edit;
        scope.save = save;
        scope.cancel = cancel;
        scope.onKeypress = onKeypress;
        scope.label = scope.input;
        scope.model = { value: '' };
        scope.isEditing = scope.autofocus ? scope.autofocus : false;

        var oldValue;

        function edit () {
            $q.when(scope.preEditing()).then(function() {
                oldValue = scope.object[scope.key];
                scope.model.value = oldValue;
                scope.label = '&gt; ' + scope.input;
                scope.onEditing();
                scope.isEditing = true;
            });
        }

        function save () {
            scope.object[scope.key] = scope.model.value;
            scope.onSave();
            onFinally();
        }

        function cancel () {
            scope.object[scope.key] = oldValue;
            scope.onCancel();
            onFinally();
        }

        function onKeypress (event) {
            if (event.keyCode === KeyCodeConstant.ENTER) {
                save();
            } else if (event.keyCode === KeyCodeConstant.ESC) {
                cancel();
            }
        }

        function onFinally () {
            scope.label = scope.input;
            scope.isEditing = false;
            scope.onFinally();
        }

        scope.onInit({ $scope: scope });
    }
}
</code></pre>

<p>})(angular);</p>

<p>Here is how i use it;</p>

<pre><code>&lt;input class="form-margin"
                        data-ex-input="Assignment ID"
                        data-is-editable="true"
                        data-ng-model-object="vm.contract"
                        data-ng-pattern="{{vm.AssignmentIdRegex}}"
                        data-input-name="assignmentId"
                        data-ng-model-key="assignmentId" /&gt;
                    &lt;div class="alert alert-info"
                    data-ng-show="contractForm.assignmentId.$error.pattern &amp;&amp; contractForm.assignmentId.$dirty"&gt;
                        &lt;strong&gt;Assignment ID: &lt;/strong&gt;ie. AS12345678 or 61234567
                    &lt;/div&gt;
</code></pre>