Question

我有两个元素，其中只有一个元素应该一次显示而另一个元素保持隐藏状态直到可见元素消失（按钮点击），这里是我尝试过的最后一个逻辑的示例使用

.......
<div ng-show='show'>
Visible element
<button ng-click='toggle()'> Toggle </button>
</div>
<div ng-hide='show'>
Hidden Element
</div>

.......

我的控制器中有这样的东西

........
$scope.show = true;
$scope.toggle = function(){
$scope.show =!$scope.show;
}
.........

现在，只要我点击按钮，第一个元素就会消失但第二个元素不会显示。我真的需要帮助。

Answer 1

你必须把你的按钮放在ng-show div之外

[\d.]+

然后它的工作正常。希望这有帮助...

Answer 2

这是解决方案

＆＃13;

var app = angular.module('plunker', []);

app.controller('MainCtrl', function($scope) {
$scope.show = true;
$scope.toggle = function(){
$scope.show =!$scope.show;
}
});

＆＃13;

<!DOCTYPE html>
<html ng-app="plunker">

<head>
  <script>
    document.write('<base href="' + document.location + '" />');
  </script>
  <link rel="stylesheet" href="style.css" />
  <script data-require="angular.js@1.5.x" src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.11/angular.min.js" data-semver="1.5.11"></script>
  <script src="app.js"></script>
</head>

<body ng-controller="MainCtrl">
  <div ng-show='show'>
    Visible element
  </div>

  <div ng-hide='show'>
    Hidden Element
  </div>
  <button ng-click='toggle()'> Toggle </button>
</body>

</html>

＆＃13;

如何在angularJS

2 个答案: