码迷,mamicode.com
首页 > Web开发 > 详细

--@angularJS--ng-show应用

时间:2015-05-17 14:54:45      阅读:144      评论:0      收藏:0      [点我收藏+]

标签:

本篇给出ng-show的示例代码,以供参考.

1、NgShow.html:

<!doctype html>
<html ng-app="MyCSSModule">

<head>
    <meta charset="utf-8">
</head>

<body>
    <div ng-controller=‘DeathrayMenuController‘>
        <button ng-click=‘toggleMenu()‘>Toggle Menu</button>
        <ul ng-show=‘menuState.show‘>
            <li ng-click=‘stun()‘>Stun</li>
            <li ng-click=‘disintegrate()‘>Disintegrate</li>
            <li ng-click=‘erase()‘>Erase from history</li>
        </ul>
    </div>
</body>

<script src="js/angular-1.3.0.js"></script>
<script src="NgShow.js"></script>

</html>

2、NgShow.js:

var myCSSModule = angular.module(‘MyCSSModule‘, []);
myCSSModule.controller(‘DeathrayMenuController‘, [‘$scope‘,
    function($scope) {
        $scope.menuState={show:false};
        $scope.toggleMenu = function() {                                                            //给出交互方法,每次调用都反转
            $scope.menuState.show = !$scope.menuState.show;
        };
    }
])

--@angularJS--ng-show应用

标签:

原文地址:http://www.cnblogs.com/koleyang/p/4509597.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!