angularjs – 角度选择闪烁

前端之家收集整理的这篇文章主要介绍了angularjs – 角度选择闪烁前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我有一个简单的< select>< / select>在< div>内使用ng-show属性,类似于:
<div ng-show="edit">
  <select ng-options="key as value in VALUES"></select>
</div>

现在出于某种原因,当我点击选择打开它时,它会闪烁,就像选择是打开/关闭真的很快.有时会眨眼两次,有时甚至更多.我之前使用过有角度的选择框,从来没有这个.

我发现了导致它的原因.它发生的完整形式如下:

<form class="mb-lg" name="formValidate" ng-init="addCreate = '.action_add'" novalidate="" role="form">
  <label class="radio-inline c-radio">
    <input id="action_add" name="add_create" ng-model="addCreate" required="required" type="radio" value=".action_add">
    <span class="fa fa-circle"></span>
    Add to existing
  </label>
  <div class="form-group has-Feedback">
    <select class="form-control" name="selected" ng-disabled="addCreate != '.action_add'" ng-model="selected" ng-options="p as p.name for p in portfolios | filter : {'update?': true}" ng-required="addCreate == '.action_add'" required="required"></select>
  </div>
  <label class="radio-inline c-radio ng-binding">
    <input id="action_create" name="add_create" ng-model="addCreate" required="required" type="radio" value=".action_create">
      <span class="fa fa-circle"></span>
      Or Create new one
  </label>
  <div class="form-group has-Feedback">
    <input class="form-control" name="name" ng-disabled="addCreate != '.action_create'" ng-model="new" ng-required="addCreate == '.action_create'" disabled="disabled">
  </div>
</form>

显示表单时,第一个< input> (所选单选按钮)是聚焦的,当我点击< select>时打开它,将发生$apply(这是Angular的基本行为,没有自定义)导致< select>重新编译?如果我点击任意位置,则< select>不会闪烁,或者我像$(‘:focus’)手动模糊一样.bluck();然后它也不会眨眼.

注意:表单在对话框(ngDialog)中,不确定是否有所不同

它似乎是这个错误

https://bugs.chromium.org/p/chromium/issues/detail?id=613885

正如评论中所建议的,在select上设置转换为none已经解决了这个问题,在我的情况下(使用bootstrap)使用以下方法

select.form-control { transition: none; }

要在没有引导程序的情况下使用,或者在不使用.form-control类的情况下使用,只需删除.form-control选择器并确保其他任何内容都不会覆盖select元素的transition属性

select { transition: none; }
原文链接:https://www.f2er.com/angularjs/142060.html

猜你在找的Angularjs相关文章