.html
<md-button class="btn btn-primary text-center center-block" type="submit" style="padding: 6px 100px"
ng-click="showSpinner = !showSpinner" class="btn btn-default btn-sm view-mode pull-left" my-click-once keep-width>
<span ng-show="!showSpinner">Demo of the circular spinner in md-button</span>
<md-progress-circular ng-show="showSpinner" md-mode="indeterminate"></md-progress-circular>
</md-button>
的.js
//Directive for progress spinner
app.directive('keepWidth', function() {
return {
restrict: 'A',
link: function(scope, element, attrs, controller) {
var width = element.prop('offsetWidth');
var otherCss = element.css('cssText');
attrs.$set('style', 'width: ' + width + 'px;' + otherCss);
}
}
});
上面是我的代码,我只想在点击时显示进度微调器。我使用角1.5.0因为我必须。
当我按下按钮时,它会收缩并删除文本,这就是全部。
我使用此https://material.angularjs.org/latest/作为参考。我被告知这些是angularJS 1的材料(我假设包括1.5.0)
我做错了什么?我的材料不正确吗?不确定angularJS 1是否可以使用md-progress-circular,但这些材料不同意。
谢谢!
答案 0 :(得分:0)
将md-progress
放在您的md按钮之外。另外,请使用ng-if
代替ng-show
。
<md-button class="btn btn-primary text-center center-block" type="submit" style="padding: 6px 100px" ng-click="showSpinner = !showSpinner" class="btn btn-default btn-sm view-mode pull-left" my-click-once keep-width>
<span ng-show="!showSpinner">Demo of the circular spinner in md-button</span>
</md-button>
<md-progress-circular ng-if="showSpinner" mode="indeterminate"></md-progress-circular>