Tạo custom form validation trong AngularJS

AngularJS là một JavaScript framework khá mạnh, cung cấp cho chúng ta khá nhiều đồ chơi, trong đó có validation.
Nó, AngularJS, không những cung cấp cho chúng ta sẵn một số validation như: required, pattern, min, max, minlenght, maxlength mà còn cho phép chúng ta tạo ra những validation cho chính chúng ta
Ok. Sau đây chúng ta sẽ tập tành viết một custom validation để kiểm tra người dùng có nhập từ bậy bạ vào comment

1. Tạo ra directive dùng để validation

var app = angular.module('AngularJSLab', []);

app.directive('hasBadWords', function () {
    return {
        restrict: 'A',
        require: 'ngModel',
        link: function (scope, elm, attrs, ctrl) {
            ctrl.$parsers.unshift(function (viewValue) {
                var filterWords = ["fool", "dumb", "shit", "ass"];
                var rgx = new RegExp(filterWords.join("|"), "gi");
                if (rgx.test(viewValue)) {
                    ctrl.$setValidity('hasBadWords', false);
                    return undefined;
                }
                else 
                {
                    ctrl.$setValidity('hasBadWords', true);
                    return viewValue;
                }
            });
        }
    };
});

Với đoạn mã trên, chúng ta đơn giản chỉ xây dựng một directive dạng attribute, để chúng ta sử dụng nó như là một attribute của thẻ html
Bất cứ khi nào người dùng tương tác với control, trong trường hợp của chúng ta là người dùng sẽ gõ gõ vào cái textarea mà người dùng sẽ viết bình luận, thì nó sẽ gọi hàm setViewValue của ngModelController. Đồng thời hàm của chúng ta dùng kiểm tra những từ bậy bạ được đưa vào danh sách parsers của controller. Và sau đó tất cả các function trong mảng parsers sẽ được thực thi để validate dữ liệu
2. Sử dụng directive

    
    
    
    


    
        
        Vui lòng nhập bình luận
        Xin đừng dùng từ bậy bạ
    

Khi chúng ta sử dụng directive này cho control của chúng ta, khi người dùng nhập vào những từ như fool, ass… thì ra kết quả như hình sau: