Question

我有3个Angular函数可以切换搜索功能。但是，我只希望能够一次选择一个。

＆＃13;

/* Trauma Search functionality */
$scope.traumaSearch = false;
$scope.traumaText = "Trauma Center";
$scope.toggleTraumaSearch = function() {
  $scope.traumaSearch = !$scope.traumaSearch;
  if ($scope.traumaSearch) {
    $scope.traumaText = "Select a location...";
    canvas.style.cursor = 'crosshair';
  } else {
    $scope.traumaText = "Trauma Center";
    canvas.style.cursor = '';
  }
}

/* Police Search functionality */
$scope.policeSearch = false;
$scope.policeText = "Police Station";
$scope.togglePoliceSearch = function() {
  $scope.policeSearch = !$scope.policeSearch;
  if ($scope.policeSearch) {
    $scope.policeText = "Select a location...";
    canvas.style.cursor = 'crosshair';
  } else {
    $scope.policeText = "Police Station";
    canvas.style.cursor = '';
  }
}

/* Fire Search functionality */
$scope.fireSearch = false;
$scope.fireText = "Fire Station";
$scope.toggleFireSearch = function() {
  $scope.fireSearch = !$scope.fireSearch;
  if ($scope.fireSearch) {
    $scope.fireText = "Select a location...";
    canvas.style.cursor = 'crosshair';
  } else {
    $scope.fireText = "Fire Station";
    canvas.style.cursor = '';
  }
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div id="marker">
  <!-- LOCATION BUTTONS -->
  <h2>Find the Nearest Emergency Services</h2>
  <button class="btn btn-info" ng-click="toggleTraumaSearch()">{{traumaText}} </button>
  <button class="btn btn-info" ng-click="togglePoliceSearch()">{{policeText}}</button>
  <button class="btn btn-info" ng-click="toggleFireSearch()">{{fireText}}</button>
</div>

＆＃13;

我尝试使用ng-disabled解决此问题（如disable the button after one click using ng-disable所述），但这不起作用。特别是第二种解决方案，通过添加第二个＆＃34; if＆＃34;声明功能打破了。这可能是由于我使用了不正确的语法。

我也尝试将用户的输入限制为功能范围的一部分。它可能是一个新用户，我通过添加＆＃34; $ scope.toggleFireSearch.input = false＆＃34;

使用了错误的语法

也许我正在咆哮错误的树。是否建议使用推荐的指令来解决我的问题？

Answer 1

您可以使用元素标记ng-if="VARNAME"来检查范围中的变量是否为true。为每个搜索元素（或数组）设置不同的var。然后你可以让ToggleWhateverSearch（）将var设置为true而其他所有设置为false。

使用Angular选择另一个时禁用按钮

1 个答案: