ubah nilai atribut di dalam arahan

saya mencoba membuat masukan yang berfungsi seperti kartu kredit, html saya terlihat seperti ini

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

dan arahan saya terlihat seperti ini

.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);
            });

        }
    };
});

sekarang masalahnya ada di dalam direktif, baris

attrs.uiMask = "****";

sebenarnya mengubah atribut ui-mask dari input, tetapi ketika saya menggunakan hal yang sama di dalam fungsi $watch itu, atributnya tidak berubah meskipun masuk ke if atau else. Tampaknya hanya berfungsi di awal fungsi tautan dan jika saya memanggilnya di dalam suatu fungsi, itu tidak berfungsi lagi.

Saya harap saya bisa mendapatkan bantuan dalam hal ini, terima kasih sebelumnya, Daniel!