Javascript 角度ng重复防止默认备选方案

我正在为输入类型选项使用库。 我用复选框在列表中显示它

问题是每当我点击输入选择选项时，我也在选择 复选框。我决定使用event.preventDefault（），但它破坏了选择选项，我打开了两个selectbox。 所以我不能使用event.preventDefault（），你知道如何解决这个问题吗

e.preventDefault();

这是一个示例，但没有用于选择选项的自定义库。

---

我现在不知道你想要实现什么，但我试着像这样重构你的代码。您应该重构DOM构造。我认为您的问题与错误的DOM层次结构有关。因此，通过单击父

p

元素，没有必要选中/取消选中复选框。所以，不管这对你有什么好处：

看法

---

我无法理解您想要实现的目标

我所了解的是，您正在一个选择栏中选择一个选项，另一个选项也是使用相同的值打开的

解决方案：-我发现您对两个选择栏使用相同的模型：data.singleSelect

---

这引起了问题。在ng模型中为两个选择栏使用不同的名称。它将解决问题。

您试图实现什么？我试图阻止在单击“选择选项”时选中复选框。由于某些原因，我无法使用event.preventDefault（）我试图在单击“选择选项”时阻止选中复选框。由于某些原因，我无法在此解决方案中使用event.preventDefault（）@User_111。当您选择一个选项时，该复选框未被选中。请提供更多关于您试图实现的目标的信息。当您单击时，它应该选中复选框，但当您单击“选择选项”时，它不应该选中复选框。确定，您为什么需要此功能？当我单击“选择”并选中复选框时，它看起来像一个bug。在这种情况下，我不能使用event Prevent Default，因为我使用的是自定义指令而不是常规的选择选项，并且我无法关闭焦点上的选择下一个选择。。

<div ng-controller="DemoCtrl">
  <p ng-repeat="role in roles" ng-click="check(role)">
      <input type="checkbox" checklist-model="user.roles" checklist-value="role.id" ng-model="role.check">                 {{role.text}}
      <select name="singleSelect" ng-model="data.singleSelect" ng-click="log()">
        <option value="option-1">Option 1</option>
        <option value="option-2">Option 2</option>
      </select>
      <select name="singleSelect" ng-model="data.singleSelect" ng-click="log()">
        <option value="option-1">Option 1</option>
        <option value="option-2">Option 2</option>
      </select>
    </p>
</div>

angular.module("DemoApp", ["checklist-model"])
  .controller('DemoCtrl', function($scope, $timeout) {

    $scope.optionClicked = false;
    $scope.check = function (role) {
      $timeout(function () {
        if (!$scope.optionClicked) {
          role.check = !role.check
        }
      }, 50);
    }

    $scope.log = function () {
      $scope.optionClicked = true;
      $timeout(function () {
        $scope.optionClicked = false;
      }, 100);
    }

    $scope.roles = [{
      check: true,
      id: 1,
      text: 'guest'
    }, {
      id: 2,
      text: 'user'
    }, {
      id: 3,
      text: 'customer'
    }, {
      id: 4,
      text: 'admin'
    }];

  });

 <select name="singleSelect" ng-model="data.singleSelect">