javascript - 如何根据所有下拉值的测试设置按钮文本？

我有一个 list 。列表中的每个项目都是一个下拉列表。

每个下拉列表的初始值或选定值是A。

还有一个按钮。

当我更改下拉值时，它应该更改按钮文本。目前正在运行。

我的问题是，当选定的下拉列表值为A时，按钮文本为Fixed。对于所有其他值，它是不固定。

https://plnkr.co/edit/8qxZRhNOryGl2f9NFEz5?p=preview

<!DOCTYPE html>
<html ng-app="plunker">
<head>
  <meta charset="utf-8" />
  <title>AngularJS Plunker</title>
  <script>document.write('<base href="' + document.location + '" />');</script>
  <link rel="stylesheet" href="style.css" />
  <script data-require="angular.js@1.4.x" src="https://code.angularjs.org/1.4.12/angular.js" data-semver="1.4.9"></script>
  <script src="app.js"></script>
</head>
<body ng-controller="MainCtrl">
  <button>{{btn}}</button>
  <div ng-repeat="x in arr">{{x}}
    <select class="selectpicker" ng-model="selectedValue" ng-change="change(selectedValue)">
      <option>A</option>
      <option>B</option>
      <option>C</option>
    </select>
  </div>
</body>
</html>

重现问题的步骤。

目前所有下拉列表均显示 A，按钮文本为固定。
将第一个下拉值 A 更改为 B。
- 按钮文本现在未固定。
将第二个下拉值 A 更改为 B。
- 按钮文本保持未固定。
将第一个下拉列表的值更改为 A，将第二个下拉列表的值保留为 B。
- 实际行为:
  - 按钮文本固定。
- 期望的行为:
  - 按钮文本应为Not Fix，因为下拉列表值之一不是A。

问题:如何更改下面的代码以实现所需的行为。

$scope.change = function(value){
  console.log(value);
  if(value !='A'){
    $scope.btn = ' NOT Fixed';
  }else{
    $scope.btn = 'Fixed';
  }
}

最佳答案

If you again change the value of first dropdown B to A .it show button text is Fixed why ??

选择“A”时，文本为“固定”，因为您的 if 语句显示“如果值不是 a，则将 $scope.btn 分配给 'NOT Fix'，否则将 $scope.btn 分配给 'Fixed'。

Fixed text only show when each dropdown value is A`.

为了实现此目的，您必须以不同的方式分配 $scope.btn。在重新分配变量之前，您不仅需要引用传入的值，还需要查看另外 2 个选择菜单的值。

关于javascript - 如何根据所有下拉值的测试设置按钮文本？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/46384815/

javascript - 如何根据所有下拉值的测试设置按钮文本？

上一篇：javascript - 解析到我输入的元素的动态链接

下一篇：javascript - 如何在firebase中迭代对象的对象？