美文网首页
菜鸡学AngularJS 06 绑定点击事件 (显示、隐藏 页面

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

作者: 菜鸡 | 来源:发表于2016-07-21 10:49 被阅读80次

    点击事件显示或隐藏元素

    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>

    相关文章

      网友评论

          本文标题:菜鸡学AngularJS 06 绑定点击事件 (显示、隐藏 页面

          本文链接:https://www.haomeiwen.com/subject/mwrbjttx.html