angularjs - Angular 选择闪烁

Question

我有一个简单的<select></select>里面 <div>与 ng-show属性，例如:

<div ng-show="edit">
  <select ng-options="key as value in VALUES"></select>
</div>

现在，由于某种原因，当我单击select时要打开它，它会闪烁，就像选择非常快地打开/关闭一样。有时它会闪烁两次，有时会闪烁更多次。我用过select以前有 Angular 的盒子，从来没有这个。

我发现是什么原因造成的。它发生的完整形式如下所示:

<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').blur();然后它也不闪烁。

注意:表单位于对话框中 ( ngDialog )，不确定这是否有影响

Answer 1

这似乎是这个错误:

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

正如评论中所建议的，在选择上将转换设置为 none 可以解决该问题，在我的情况下(使用 Bootstrap )使用以下命令:

select.form-control { transition: none; }

如果不使用 Bootstrap ，或者不使用 .form-control 类，只需删除 .form-control 选择器并确保没有其他内容覆盖选择元​​素上的过渡属性:

select { transition: none; }