分享web开发知识

注册/登录|最近发布|今日推荐

主页 IT知识网页技术软件开发前端开发代码编程运营维护技术分享教程案例
当前位置:首页 > IT知识

angularjs的ng-change事件演示

发布时间:2023-09-06 01:21责任编辑:顾先生关键词:js

今天练习angularjs的ng-change事件。

比如用户作出选择时,系统所指定的选项中,没有用户合适的选项。此时我们可以让用户填写。



 刚开始文本框是隐藏的。当用户选择了checkbox之后才会显示出来。


在angularjs程序的model中IsVisible的值为false。

这样子,程序在运行时,文本框就是隐藏的。

接下来,我需要在程序中,添加一个Checkbox:

上面的ng-change的值就是一个angularjs的方名ShowHide:

最后看看下图示例,相信你能看得懂与明白所表达的意思:

完整的angularjs代码:

 var appoo = angular.module(‘App1‘, []); ???????appoo.controller(‘Ctrl1‘, function ($scope) { ???????????$scope.IsVisible = false; ???????????$scope.ShowHide = function () { ???????????????$scope.IsVisible = $scope.ShowOtherDescript; ???????????}; ???????});
Source Code


完整的html代码:

<div ng-app="App1" ng-controller="Ctrl1"> ???????????????????<input id="Checkbox1" type="checkbox" ng-model="ShowOtherDescript" ng-change="ShowHide()" />其它说明 ??????????????????<div ng-show="IsVisible"> ??????????????????????<input id="Text1" type="text" /> ???????</div> ???</div>
Source Code

angularjs的ng-change事件演示

原文地址:http://www.cnblogs.com/insus/p/7761456.html

知识推荐

我的编程学习网——分享web前端后端开发技术知识。 垃圾信息处理邮箱 tousu563@163.com 网站地图
icp备案号 闽ICP备2023006418号-8 不良信息举报平台 互联网安全管理备案 Copyright 2023 www.wodecom.cn All Rights Reserved