เปลี่ยนค่าแอตทริบิวต์ภายในคำสั่ง

ฉันกำลังพยายามป้อนข้อมูลที่ทำหน้าที่เหมือนบัตรเครดิต html ของฉันมีลักษณะเช่นนี้

<input  id="card-number" class="card-number" name="card-number" card-number ng-model="card.number" ui-mask="**** **** **** ****" />

และคำสั่งของฉันมีลักษณะเช่นนี้

.directive('cardNumber', function($cardUtils) {
    return {
        restrict: 'A',
        require: ['^card', 'ngModel'],
        scope: {
            model: '=ngModel'
        },
        link: function(scope, elem, attrs, ctrls) {

            attrs.uiMask = "****";

            var cardCtrl = ctrls[0],
                ngModelCtrl = ctrls[1];

            var watchModel = function() {
                return ngModelCtrl.$viewValue;
            }

            scope.$watch(watchModel, function() {
                var cardType = $cardUtils.getCardByNumber(ngModelCtrl.$viewValue);
                if(cardType.classname == 'american-express')
                    attrs.uiMask = "****     ******     *****";
                else
                    attrs.uiMask = "****     ****     ****     ****";
                    scope.$apply();
                cardCtrl.updateCardClass(ngModelCtrl.$viewValue);
            });

        }
    };
});

ตอนนี้ปัญหาอยู่ในคำสั่งบรรทัด

attrs.uiMask = "****";

จริง ๆ แล้วเปลี่ยนแอตทริบิวต์ ui-mask จากอินพุต แต่เมื่อฉันใช้สิ่งเดียวกันภายในฟังก์ชัน $watch นั้น attrbute จะไม่เปลี่ยนแม้ว่าจะเข้าไปใน if หรืออย่างอื่นก็ตาม ดูเหมือนว่าจะใช้งานได้เฉพาะตอนเริ่มต้นของฟังก์ชันลิงก์เท่านั้น และหากฉันเรียกมันภายในฟังก์ชัน มันจะไม่ทำงานอีกต่อไป

ฉันหวังว่าฉันจะได้รับความช่วยเหลือในเรื่องนี้ ขอบคุณล่วงหน้า แดเนียล!