栏目分类:
子分类:
返回
名师互学网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
名师互学网 > IT > 面试经验 > 面试问答

为什么angular的ng-disabled无法与bootstrap的btn类一起使用?

面试问答 更新时间: 发布时间: IT归档 最新发布 模块sitemap 名妆网 法律咨询 聚返吧 英语巴士网 伯小乐 网商动力

为什么angular的ng-disabled无法与bootstrap的btn类一起使用?

ngDisabled
仅适用于响应该
disabled
属性的元素(输入,文本区域,单选按钮,按钮标签等)。在Bootstrap中,您必须将“
disabled”类添加到btn元素中。看起来像这样:

<div >I'm a button!</div>

为此,请在指令/控制器中定义一个变量,如下所示:

$scope.disableButtons = true;

然后使用angular

ngClass
来基于变量动态添加类,如下所示:

<div  ng- ng-click="doSomething()">I'm a button!</div>

每次

disableButtons
在范围内更改变量时,该按钮将在视图中根据值显示为禁用或启用。

注意: 将禁用的类添加到btn元素不会阻止JS单击事件的发生。为此,您必须在

doSomething()
函数中编写一个钩子,如下所示:

$scope.doSomething = function() {  if($scope.disableButtons) {    return;  }  // Else, really do something}

编辑:
看来我并没有真正回答这个问题。真正的答案(我相信)是

disabled
仅适用于
.btn
元素以及链接
<a><a/>
和列表
<li><li/>
元素(…,可能还有更多),因为这是Bootstrap定义的。这是来自Bootstrap的
btn
元素来源:

.btn.disabled, .btn[disabled], fieldset[disabled] .btn {  cursor: not-allowed;  pointer-events: none;  opacity: .65;  filter: alpha(opacity=65);  -webkit-box-shadow: none;  box-shadow: none;}

为了使此功能适用于锚标记,您将必须编写自己的CSS来复制此标记,如果使用SASS来完成类似

@extend
样式的操作,则更好。



转载请注明:文章转载自 www.mshxw.com
本文地址:https://www.mshxw.com/it/397950.html
我们一直用心在做
关于我们 文章归档 网站地图 联系我们

版权所有 (c)2021-2022 MSHXW.COM

ICP备案号:晋ICP备2021003244-6号