Question

var app=angular.module('app',[]);

.box
{
width:50px;
height:50px;
background-color:red;
}
span
{
position:absolute;
left:190px;
top:10px;
}

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="app">
  <input ng-click="showBox =! showBox" placeholder="Click me"/>
  <div class="box" ng-show="showBox"></div>
  <span>Hide box</span>
</div>

嘿，我对一个非常新的AngularJS用户有一个问题。这只是一个例子，但显示了想法。当点击输入红色div时会显示，但如果你再次点击div hide。但是我不希望第二次点击隐藏这个div，我希望点击Hide box隐藏div。我想在输入中单击显示红色div但如果再次单击则不隐藏

Answer 1

使用

ng-click="showBox = true"

假设它被初始化为假。

如果您想使用隐藏框隐藏

<span ng-click="showBox = false">Hide box</span>

Answer 2

将其设置为true，

ng-click="showBox = true"

<强>样本

＆＃13;

var app=angular.module('app',[]);
app.controller("dobController", ["$scope",
  function($scope) {
  $scope.showBox =false;
  }
]);

＆＃13;

.box
{
width:50px;
height:50px;
background-color:red;
}
span
{
position:absolute;
left:190px;
top:10px;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="app">
  <input ng-click="showBox = true" placeholder="Click me"/>
  <div class="box" ng-show="showBox"></div>
  <span>Hide box</span>
</div>

＆＃13;

ng-show，仅显示但如果再次单击则不隐藏元素

2 个答案: