javascript - AngularJS Directive Dynamically Change Attribute -

i have bank selector. when user change bank, mask of bank's account should dynamically change.

i made directive make dynamic change. i'm inspecting dom , mask being updated, it's not working, mask remains first one.

html:

<fieldset>     <select ng-model="bankinfo.bank" ng-options="bank.name bank in banks"></select>     <input bank-mask="bankinfo" type="text" ng-model="bankinfo.account"> </fieldset> 

bankmask directive:

return {     restrict: 'a',     require: 'ngmodel',     scope: {         bankinfo: '=bankmask'     },     link: function(scope, element, attrs, ngmodel) {         scope.$watch('bankinfo.bank.code', function(newbankcode, oldbankcode) {             if (oldbankcode !== newbankcode) {                 element.attr('mask', getmask(newbankcode));                 $compile(element)(scope);             }         });     } };