练习ng-show和ng-hide的方法

2018-06-22 06:11:59来源:未知 阅读 ()

新老客户大回馈,云服务器低至5折

在程序设计过程,我们需要把某一元素或是或一块进行显示与隐藏。

如你正使用angularjs的话,就可以使用ng-show或者ng-hide来进行控制。

 

var showhideApp = angular.module('showhideApp', []);
Source Code

 

定义控制器,其中编写2个铵钮的事件:

 

showhideApp.controller('showhideController', function ($scope) {
    $scope.IsVisibled = false;

    $scope.ShowDivTag = function () {
        $scope.IsVisibled = true;
    }

    $scope.HideDivTag = function () {
        $scope.IsVisibled = false;
    }
});
Source Code


html代码:

 

<div ng-app="showhideApp" ng-controller="showhideController">
        <div>
            <input type="button" value="ShowDivTag" ng-click="ShowDivTag()" />
            <input type="button" value="HideDivTag" ng-click="HideDivTag()" />
        </div>
        <div>
            <div ng-show="IsVisibled">Insus.NET</div>
        </div>
    </div>
Source Code

 

预览:


 

标签:

版权申明:本站文章部分自网络,如有侵权,请联系:west999com@outlook.com
特别注意:本站所有转载文章言论不代表本站观点,本站所提供的摄影照片,插画,设计作品,如需使用,请与原作者联系,版权归原作者所有

上一篇:ASP.Net WebAPI与Ajax进行跨域数据交互时Cookies数据的传递

下一篇:Ajax动态加载数据