AngularJS基于MVC的复杂操作实例讲解


Posted in Javascript onDecember 31, 2017

实例如下:

<!DOCTYPE html>
<html>
 <head>
  <meta charset="UTF-8">
  <title>AngularJS基于MVC的复杂操作案例</title>
  <script type="text/javascript" src="../js/angular.min.js"></script>
 </head>
 <body>
  <!--ng-app="myapp"定义了一个模块-->
  <div ng-app="myapp" ng-controller="myctrl">
   <div>
    <!--ng-model模型作用-->
    <input type="text" name="name" ng-model="name" />
    <!--提供按钮-->
    <input type="button" value="清空" ng-click="clearVal()" />
   </div>
   <div>
    <!--{{}}等价于ng-bind用于数据显示-->
    hello,{{name}}
   </div>
  </div>
 </body>
 <script type="text/javascript">
  //初始化myapp模块
  var myapp = angular.module("myapp",[]);
  //定义模块的控制器
  //依赖注入,$scope作用域对象,操作当前作用域视图
  myapp.controller("myctrl",["$scope",function($scope){
   //对模型进行初始化赋值
   $scope.name = "你我他学习吧";
   //在作用域提供clearVal点击事件
   $scope.clearVal = function(){
    //模型设置为空
    $scope.name = "";//清空输入框内容
   }
  }]);
 </script>
</html>

以上这篇AngularJS基于MVC的复杂操作实例讲解就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
用javascript获取textarea中的光标位置
May 06 Javascript
JS 文件本身编码转换 图文教程
Oct 12 Javascript
jquery中输入验证中一个不错的效果
Aug 21 Javascript
JQuery操作元素的css样式
Mar 09 Javascript
ReactNative-JS 调用原生方法实例代码
Oct 08 Javascript
javascript显示系统当前时间代码
Dec 29 Javascript
Vue2.0实现购物车功能
Jun 05 Javascript
Javascript实现时间倒计时效果
Jul 15 Javascript
jQuery easyui datagird编辑行删除行功能的实现代码
Sep 20 jQuery
vue实现的网易云音乐在线播放和下载功能案例
Feb 18 Javascript
javascript canvas检测小球碰撞
Apr 17 Javascript
基于openlayers实现角度测量功能
Sep 28 Javascript
jQuery实现页码跳转式动态数据分页
Dec 31 #jQuery
React数据传递之组件内部通信的方法
Dec 31 #Javascript
javascript 通过键名获取键盘的keyCode方法
Dec 31 #Javascript
vue vuex vue-rouert后台项目——权限路由(适合初学)
Dec 29 #Javascript
Angular实现的内置过滤器orderBy排序与模糊查询功能示例
Dec 29 #Javascript
Angular实现的敏感文字自动过滤与提示功能示例
Dec 29 #Javascript
Angular实现点击按钮控制隐藏和显示功能示例
Dec 29 #Javascript
You might like
js类中获取外部函数名的方法
2007/08/19 Javascript
javascript得到XML某节点的子节点个数的脚本
2008/10/11 Javascript
javascript hasFocus使用实例
2010/06/29 Javascript
javascript-简单的日历实现及Date对象语法介绍(附图)
2013/05/30 Javascript
Javascript前端UI框架Kit使用指南之kitjs事件管理
2014/11/28 Javascript
js实现仿百度汽车频道选择汽车图片展示实例
2015/05/06 Javascript
jQuery判断指定id的对象是否存在的方法
2015/05/22 Javascript
JS建造者模式基本用法实例分析
2015/06/30 Javascript
javascript常用的方法分享
2015/07/01 Javascript
轻量级javascript 框架Backbone使用指南
2015/07/24 Javascript
JS实现适合于后台使用的动画折叠菜单效果
2015/09/21 Javascript
js实现滚动条滚动到页面底部继续加载
2015/12/19 Javascript
学习JavaScript事件流和事件处理程序
2016/01/25 Javascript
JavaScript禁止用户多次提交的两种方法
2016/07/24 Javascript
从零开始学习Node.js系列教程六:EventEmitter发送和接收事件的方法示例
2017/04/13 Javascript
vue 将页面公用的头部组件化的方法
2017/12/18 Javascript
JS+HTML5实现获取手机验证码倒计时按钮
2018/08/08 Javascript
解决vue+element 键盘回车事件导致页面刷新的问题
2018/08/25 Javascript
layui数据表格实现重载数据表格功能(搜索功能)
2019/07/27 Javascript
基于leaflet.js实现修改地图主题样式的流程分析
2020/05/15 Javascript
python 实现上传图片并预览的3种方法(推荐)
2017/07/14 Python
wxpython实现图书管理系统
2018/03/12 Python
python3调用百度翻译API实现实时翻译
2018/08/16 Python
Django密码存储策略分析
2020/01/09 Python
PyCharm无法引用自身项目解决方式
2020/02/12 Python
pip已经安装好第三方库但pycharm中import时还是标红的解决方案
2020/10/09 Python
HTML5 3D书本翻页动画的实现示例
2019/08/28 HTML / CSS
AmazeUI中各种的导航式菜单与解决方法
2020/08/19 HTML / CSS
英国健康和美容技术产品购物网站:CurrentBody
2019/07/17 全球购物
工作说明书格式
2014/07/29 职场文书
县委班子四风对照检查材料思想汇报
2014/09/29 职场文书
学校政风行风自查自纠报告
2014/10/21 职场文书
民事起诉状范文
2015/05/19 职场文书
2016年清明节期间群众祭祀活动工作总结
2016/04/01 职场文书
jackson json序列化实现首字母大写,第二个字母需小写
2021/06/29 Java/Android
postgresql使用filter进行多维度聚合的解决方法
2021/07/16 PostgreSQL