Angular学习记录-显示与隐藏

Angular学习记录-显示与隐藏

在学习之前,首先声明以下,暂时日后更新的AngularJS学习记录系列的文章,都将会是结合本人正在看的《AngularJS 实战》书籍里的内容进行分享和个人观点及评价。

简单粗暴直接看代码


<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>ng-repeattitle>
    <script src="../js/angular.min.js">script>
    <style>
        body{font-size:12px;}
        ul{list-style-type: none;margin:0;padding:0;}
        div{margin:8px 0;}
    style>
head>
<body ng-app="app" ng-controller="myCtr">

    <div>
        <div ng-show="{{isShow}}">LamHodiv>
        <div ng-hide="{{isHide}}">[email protected]div>
        <ul ng-switch on="{{switch}}">
            <li ng-switch-when="1">LamHoli>
            <li ng-switch-when="2">[email protected]li>
            <li ng-switch-default>更多li>
        ul>
    div>
<script>
    var app = angular.module('app',[]);

    app.controller('myCtr',['$scope',function($scope){

        $scope.isShow = true;
        $scope.isHide = false;
        $scope.switch = 3;

    }])

script>
body>
html>

由此可以看到控制显示和隐藏的方法,当然控制显示和隐藏的方式还可以用三目运算进行判断

你可能感兴趣的:(Angular学习)