zoukankan      html  css  js  c++  java
  • directive ngHide

    ngHide指令根据提供给ngHide属性的表达式显示或隐藏给定的HTML元素。

    通过删除或者添加到元素上的CSS类来显示或隐藏元素。

    用法:

    index.html
    <html ng-app="extendApp">
    <head>
        <meta charset="UTF-8">
        <title></title>
        <style type="text/css">
            .check-element {
                border: 1px solid black;
                opacity: 1;
                padding: 10px;
            }
        </style>
        <script src="framework/angular.js"></script>
        <script src="js/aaa.js"></script>
    </head>
    <body ng-controller="extendController">
    Hide: <input type="checkbox" ng-model="checked" aria-label="Toggle ngHide"><br />
    <div class="check-element" ng-hide="checked">
        I hide when your checkbox is checked.
    </div>
    <div>
        aaaa
    </div>
    </body>
    </html>
    
    script.js
    angular.module("extendApp",[])
        .controller("extendController",function ($scope) {
            $scope.checked = false;
        });

    效果:

    可以看出当隐藏的时候连同位置也被删除

  • 相关阅读:
    关于浏览器及系统的判断
    toggle与slideToggle
    安卓与ios的不同处理
    关于常用循环遍历获取数据
    docker
    Mysql
    rabbitMQ的使用转载
    Git命令行
    vue项目创建完整版
    redis操作(str.hash.list.set)
  • 原文地址:https://www.cnblogs.com/ms-grf/p/7008928.html
Copyright © 2011-2022 走看看