这是我的第一个AngularJS指令,所以请善待:D
我试图在我写的指令中使用ladda指令,我使用了'要求'属性,但它似乎没有效果。
以下是代码:
ladda-button.js
app.directive('laddaButton', function () {
return {
restrict: 'E',
priority: -100,
require: 'ladda',
scope: {
ngIf: '@',
laddaVariable: '=',
buttonClass: '@',
iconClass: '@',
text: '@',
loadingText: '@',
onClick: '&'
},
bindToController: true,
templateUrl: './tpl/directives/button.html',
controller: function ($scope) {
console.log($scope.laddaVariable)
var auxText = $scope.text
$scope.loading = function () {
$scope.text = $scope.loadingText;
var stop = $scope.$watch('laddaVariable', function (newVal, old) {
if (!newVal) {
$scope.text = auxText;
stop();
}
});
}
}
}
});
button.html
<button class="{{buttonClass}}" ng-click="onClick(); loading();" ladda=laddaVariable data-style="expand-right"><i class="{{iconClass}}"></i>{{text}}</button>
这是一个实现:
<ladda-button on-click="fake()"
ng-if="true"
ladda-variable="test"
icon-class="fa fa-gear"
button-class="btn btn-addon btn-primary"
text="Richiedi credenziali SIP"
loading-text="Caricando..."></ladda-button>
这是控制器:
$scope.test = false;
$scope.fake = function(){
$scope.test = true;
$timeout(function(){
$scope.test = false;
}, 2000);
}
}