时间:2021-05-28
本文实例讲述了AngularJS中控制器函数的定义与使用方法。分享给大家供大家参考,具体如下:
HTML正文:
<body ng-app="myApp" ng-controller="myCtrl"><h2>AngularJS函数绑定</h2><textarea ng-model="message" cols="40" rows="10"></textarea><p><button ng-click="save()">保存</button><button ng-click="clear()">清除</button></p><p>剩余字数: <span ng-bind="left()"></span></p><!-- AngualrJS的显示和隐藏逻辑控制指令:类似avalon中的ms-visible和knockout的visible指令 --><div ng-show="flag">结果:<font color="red"><span ng-bind="result"></span></font></div>Javascript操作代码:
/** * AngularJS将属性和函数直接看作是controller的平等成员, * 可以调用函数按照普通的属性的调用方式即可(knockout avalon 部分Jquery插件也是使用这种方式定义函数) */var app = angular.module("myApp", []);app.controller("myCtrl", function($scope) { $scope.message = ""; $scope.result=""; $scope.flag=false; $scope.left = function() {return 100 - $scope.message.length;}; $scope.clear = function() { $scope.message = ""; $scope.result= $scope.message; $scope.flag=false; }; $scope.save = function() { $scope.result= $scope.message; $scope.flag=true; };});效果:
更多关于AngularJS相关内容感兴趣的读者可查看本站专题:《AngularJS指令操作技巧总结》、《AngularJS入门与进阶教程》及《AngularJS MVC架构总结》
希望本文所述对大家AngularJS程序设计有所帮助。
声明:本页内容来源网络,仅供用户参考;我单位不保证亦不表示资料全面及准确无误,也不保证亦不表示这些资料为最新信息,如因任何原因,本网内容或者用户因倚赖本网内容造成任何损失或损害,我单位将不会负任何法律责任。如涉及版权问题,请提交至online#300.cn邮箱联系删除。
本文实例讲述了AngularJS实现自定义指令与控制器数据交互的方法。分享给大家供大家参考,具体如下:AngularJS自定义指令与控制器数据交互angular
AngularJS控制器AngularJS控制器控制AngularJS应用程序的数据。AngularJS控制器是常规的JavaScript对象。AngularJ
AngularJS应用主要依赖于控制器来控制数据在应用程序中的流动。控制器采用ng-controller指令定义。控制器是一个包含属性/属性和JavaScrip
AngularJS应用主要依赖于控制器来控制数据在应用程序中的流动。控制器采用ng-controller指令定义。控制器是一个包含属性/属性和JavaScrip
AngularJS控制器controller的详解一、控制器概念控制器在Angualrjs中的作用是增强视图,并且是一个函数,用来向视图的作用域中添加额外的功能