2017-04-26 55 views
2

我有角的形狀,其中輸入端(姓名,電子郵件,電話號碼,ECT)正在使用的角度指令生成:正則表達式中的角指令NG-圖案不工作

.directive('camposProductos', function() { 
return { 
    restrict: 'AEC', 
    template: '<div class="row" data-ng-class="{true: \'error\', false: \'good\'}[datosBaseForm.campo{{campo.id}}.$dirty && datosBaseForm.campo{{campo.id}}.$invalid]"> ' + 
        '<span class="fa fa-check" aria-hidden="true" data-ng-show="datosBaseForm.campo{{campo.id}}.$valid"></span>' + 
        '<label class="labelStyle col-md-4 col-sm-4 col-xs-12">{{campo.nombre}}:<span>*</span></label>' + 
        '<div class="col-md-7 col-sm-8 col-xs-12 noPaddingLat">' + 
         '<input class="inputBoxStyle" id="{{campo.id}}" data-ng-model="campo.Valor" data-ng-model-options="{ updateOn: \'blur\' }" name="campo{{campo.id}}" type="{{campo.tipo}}" required="" data-ng-pattern="{{campo.validacion}}" placeholder="{{campo.marcador}}">' +        
         '<div data-ng-show="datosBaseForm.$submitted || datosBaseForm.campo{{campo.id}}.$touched">' + 
          '<span data-ng-show="datosBaseForm.campo{{campo.id}}.$error.required" class="errorText">El {{campo.nombre}} es obligatorio.</span>' + 
          '<span data-ng-show="datosBaseForm.campo{{campo.id}}.$error.{{campo.tipo}}" class="errorText">Por favor introducir un {{campo.nombre}} valido.</span>' + 
         '</div>' + 
        '</div>' + 
       '</div>', 
    replace: true, 
    transclude: true 
}; 

} );

當我引用正則表達式表達用於驗證輸入:數據-NG-圖案=「{{campo.validacion}}」 驗證工作,但角拋出一個錯誤:

angular.js:13920 Error: [$parse:lexerr] http://errors.angularjs.org/1.5.8/$parse/lexerr?p0=Unexpected%20nextharacter%20&p1=s%200-0%20%5B%5E%5D&p2=%5E((%5B%5E%3C%3E()%5C%5B%5C%5D%5C%5C.%2C%3B%3A%5Cs%40%22%5D%2B(%5C.%5B%5E%3C%3E()%5C%5B%5C%5D%5C%5C.%2C%3B%3A%5Cs%40%22%5D%2B)*)%7C(%22.%2B%22))%40((%5C%5B%5B0-9%5D%7B1%2C3%7D%5C.%5B0-9%5D%7B1%2C3%7D%5C.%5B0-9%5D%7B1%2C3%7D%5C.%5B0-9%5D%7B1%2C3%7D%5D)%7C((%5Ba-zA-Z%5C-0-9%5D%2B%5C.)%2B%5Ba-zA-Z%5D%7B2%2C%7D))%24 

在表達數據庫是:(([[^ <>()[] \。,;:\ s @「] +(。[^ <>()[] \。,;:\ s @」] +)* )| 「+」。())@(([0-9] {1,3} [0-9] {1,3} [0-9] {1,3} [0-9 ] {1,3}])|(([a-zA-Z-0-9] +。)+ [a-zA-Z] {2,}))$ 這是一個有效的表達式,在https://www.debuggex.com/

我已經看到,ng-patt您可能需要在表達式的每一端添加「/」以使其工作。 當我添加了「/」來表達的兩端:

$scope.FormatedRegex = '/' + campo.validacion + '/'; 

角$解析:lexerr錯誤不再出現,但確認不再起作用。

當我不格式化表達式時,表單會正確驗證,但在需要使用正則表達式驗證的表單中的每個字段的控制檯中引發錯誤。

如何引用正則表達式或格式化正則表達式,以便不給出錯誤並按預期驗證字段?

+0

如果你需要從一個變量創建一個正則表達式,你需要使用一個構造符號 - '$ scope.FormatedRegex = new RegExp(campo.validacion)' –

+1

謝謝@Wiktor! 'scope.FormatedRegex = new RegExp(campo.validacion);' 這將返回一個Object,然後我必須引用對象中的「source」才能工作。 '$ scope.FormatedRegex = new RegExp(campo.validacion); campo.validacion = $ scope.FormatedRegex.source;' –

回答

1

使用正則表達式的構造函數符號,從它建立一個正則表達式對象:

$scope.FormatedRegex = new RegExp(campo.validacion); 

這將導致你可能在你的代碼還使用RegExp對象。

要獲得潛在模式,您可以使用$scope.FormatedRegex.source