angularjs中切换显示/隐藏

無名 发表于: 2018-03-28   最后更新时间: 2018-03-29  
  •   0 订阅,194 游览

1、列表隐藏/显示

<span ng-click="showList = !showList">应用列表</span>
  <ul ng-show="showList" class="sub-list">
    <li>aa</li>
    <li>aa</li>
    <li>aa</li>
  </ul>
</span>

2、标签切换

<!DOCTYPE html>
<html ng-app>
<head>
    <meta charset="utf-8">
    <title>ng-show and ng-hide directives</title>
</head>
<body>
<div ng-controller="VisibleController">
    <p ng-show="visible">字符串1</p>
    <p ng-hide="visible">字符串2</p>
    <button ng-click="toggle()">切换</button>
</div>

<script src="../lib/angularjs/1.2.26/angular.min.js"><//script>
<script>
    function VisibleController($scope) {
        $scope.visible = false;
        $scope.toggle = function () {
            $scope.visible = !$scope.visible;
        }
    }
<//script>
</body>
</html>






发表于: 3月前   最后更新时间: 3月前   游览量:194
上一条: angularjs对于不同module间的依赖注入
下一条:

评论…


  • 评论…
    • in this conversation
      提问