Açısal: $ uibModal DOM Manipülasyonu

Question

Ben Eğik UI Bootstrap ile kalıcı iletişim oluşturma, bu modal için HTML şablon:

<div class="modal-content"> 
    <div class="modal-body"> 
     ... 
    </div> 
    <div class="modal-footer"> 
     <button class="btn btn-primary" ng-click="save();">Save</button> 
    </div> 
</div> 

Ve bu kalıcı direktif için kontrolör geçerli:

app.controller('modalCtrl', [ 
    '$scope', function ($scope) { 
     return $scope.save = function() { 
      ... 
     }; 
    } 
]); 

bu onu çağırma:

$uibModal.open({ 
    templateUrl: '...', 
    controller: 'modalCtrl' 
}); 

tasarruf düğmesi tıklandığında, ben düğmeye st değiştirmek gerek

button.loading(); 

Bunu yapmanın ideal yolu nedir: Temelde böyle bir şeydir başka bir 3. taraf kitaplığı kullanarak yling/animasyon? Pek çok insanın yönergenin DOM manipülasyonu yapmanın yolu olduğunu söylediğini biliyorum, ama bunu burada nasıl yapabiliriz?

Answer 1

Bunu deneyebilirsiniz düşünüyorum:

HTML öğesine belirli bir sınıfı ekleyin: Bir yönergesi kullanmak istiyorsanız

$scope.save = function() { 
    angular.element('thebutton').loading(); 
}; 

:

<button class="btn btn-primary thebutton" ng-click="save();">Save</button> 

JS elemanı olsun:

HTML:

<button thebutton class="btn btn-primary" ng-click="save();">Save</button> 

JS:

.directive('thebutton', function() { 
    return { 
     link: function(scope, element, attrs) { 
      element.on('click', function() { 
       element.loading(); 
      }); 
     } 
    }; 
});