如何在我的情況下顯示和隱藏角度
[英]How to show and hide in angular in my case
問題描述
我想在用戶點擊某些按鈕時顯示/隱藏一些元素
我有3個按鈕。
<a href='#' ng-click = 'show()'>button 1</a>
<a href='#' ng-click = 'show()>button 2</a>
<a href='#' ng-click = 'show()>button 3</a>
與3個元素協調
<img src='img1' ng-show='img1Show'/>
<img src='img1' ng-show='img2Show'/>
<img src='img1' ng-show='img3Show'/>
在我的控制下
我有
$scope.img1Show = true;
$scope.img2Show = true;
$scope.img3Show = true;
$scope.show = function(){
//I want to control show and hide status
}
單擊按鈕1將顯示圖像1並再次單擊將隱藏圖像1。
我想知道最有效的方法。 我真的需要img1Show來img3Show嗎？ 謝謝。
2 個解決方案
解決方案1
1 2014-04-30 00:13:11
Angular是一個數據綁定框架。 你需要三個變量來標記每個img的狀態。
但是show()不是必需的。
您可以通過ng-click直接切換它們：
<a href='#' ng-click="img1Show = !img1Show">button 1</a>
<a href='#' ng-click="img2Show = !img2Show">button 2</a>
<a href='#' ng-click="img3Show = !img3Show">button 3</a>
解決方案2
1 已采納 2014-04-30 00:22:07
我為你寫了一個現場演示。 請查看http://plnkr.co/edit/jAWkDU
<!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.2.x" src="https://code.angularjs.org/1.2.16/angular.js" data-semver="1.2.16"></script>
<script src="app.js"></script>
</head>
<body ng-controller="MainCtrl">
<a href="#" ng-click="show1 = true">show 1</a>
<a href="#" ng-click="show2 = true">show 2</a>
<a href="#" ng-click="show2 != show2">toggle 2</a>
<h1 ng-show="show1">11111</h1>
<h1 ng-show="show2">22222</h1>
</body>
</html>
在我的情況下，如何正確顯示/隱藏按鈕？
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.