菜鸡学AngularJS 06 绑定点击事件 (显示、隐藏 页面元素)

点击事件显示或隐藏元素

PS:1:ng-show = " 关键字 " 定义一个ng-show方法的关键字。
PS:2:ng-click = "方法名( )" 定义一个方法名。
PS:3:$scope.contFlg = true; 先设置关键字为显示状态。
PS:4:$scope.contFlg = !$scope.contFlg; 设置关键字状态不相等。
<!doctype html>
<html ng-app = "myapp" ng-controller = "TestController">
<head>
    <script src="http://code.angularjs.org/angular-1.0.1.min.js"></script>
</head>
<body>
    <div>
        <p ng-show = "contFlg">内容</p>
        <bottom ng-click = "HideContent()">点击</bottom>
    </div>
</body>
<script>
    var app = angular.module('myapp', []);
    app.controller('TestController', function($scope) {
        $scope.contFlg = true;
        $scope.HideContent = function (){
            $scope.contFlg = !$scope.contFlg;
        };
    });
</script>
</html>
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容