我正在尝试从两个不同的 ng-click 事件切换文本。问题是，只有 text1 或 text2 应该同时显示。这是我当前的代码:
HTML:
<html lang="de" ng-app="ngToggle">
<div ng-controller="BlubCtrl">
<img ng-click="blob=!blob">
<img ng-click="blub=!blub">
<div ng-hide="blob">text1</div>
<div ng-hide="blub">text2</div>
</div>
<html>
JS:
angular.module('ngToggle', [])
.controller('BlubCtrl',['$scope', function($scope){
$scope.blub = true;
$scope.blob = true;
}]);
最佳答案
假设您希望该选项不显示或最多显示一个 div，那么您只需在作用域上的函数中处理该逻辑即可。可能如下所示。
$scope.toggleBlub = function() {
$scope.blub = !$scope.blub
$scope.blob = true;
}
$scope.toggleBlob = function() {
$scope.blob = !$scope.blob
$scope.blub = true;
}
您会将点击次数更新为以下内容。
<img ng-click="toggleBlob()">
<img ng-click="toggleBlub()">
angular.module('ngToggle', [])
.controller('BlubCtrl', ['$scope',
function($scope) {
$scope.blub = true;
$scope.blob = true;
$scope.toggleBlub = function() {
$scope.blub = !$scope.blub
$scope.blob = true;
}
$scope.toggleBlob = function() {
$scope.blob = !$scope.blob
$scope.blub = true;
}
}
]);<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="ngToggle" ng-controller="BlubCtrl">
<button ng-click="toggleBlob()">Blob</button>
<button ng-click="toggleBlub()">Blub</button>
<div ng-hide="blob">text1</div>
<div ng-hide="blub">text2</div>
</div>关于javascript - 单击一下即可切换两个不同的 div，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/31075387/