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 相关文章推荐
关于用Jquery的height()、width()计算动态插入的IMG标签的宽高的问题
Dec 08 Javascript
jquery 检测元素是否存在的实例代码
Nov 19 Javascript
jQuery中remove()方法用法实例
Dec 25 Javascript
JavaScript驾驭网页-DOM
Mar 24 Javascript
用director.js实现前端路由使用实例
Jan 27 Javascript
jacascript DOM节点——元素节点、属性节点、文本节点
Apr 18 Javascript
Vue+Jwt+SpringBoot+Ldap完成登录认证的示例代码
May 21 Javascript
javascript中如何判断类型汇总
May 14 Javascript
VUE+node(express)实现前后端分离
Oct 13 Javascript
浅谈vue-props的default写不写有什么区别
Aug 09 Javascript
微信小程序以7天为周期连续签到7天功能效果的示例代码
Aug 20 Javascript
angular *Ngif else用法详解
Dec 15 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
PHP对MongoDB[NoSQL]数据库的操作
2013/03/01 PHP
递归删除一个节点以及该节点下的所有节点示例
2014/03/19 PHP
phpmyadmin配置文件现在需要绝密的短密码(blowfish_secret)的2种解决方法
2014/05/07 PHP
PHP实现自动对图片进行滚动显示的方法
2015/03/12 PHP
PHP简单生成缩略图相册的方法
2015/07/29 PHP
PHP实现微信退款的方法示例
2019/03/26 PHP
Laravel框架Request、Response及Session操作示例
2019/05/06 PHP
Aster vs Newbee BO5 第一场2.19
2021/03/10 DOTA
JavaScript 动态创建VML的方法
2009/10/14 Javascript
Juery解决tablesorter中文排序和字符范围的方法
2015/05/06 Javascript
JavaScript中removeChild 方法开发示例代码
2016/08/15 Javascript
微信小程序 122100版本更新问题解决方案
2016/12/22 Javascript
bootstrap table分页模板和获取表中的ID方法
2017/01/10 Javascript
jQuery移除或禁用html元素点击事件常用方法小结
2017/02/10 Javascript
vue.js轮播图组件使用方法详解
2018/07/03 Javascript
vue.js响应式原理解析与实现
2020/06/22 Javascript
在vue项目中优雅的使用SVG的方法实例详解
2018/12/03 Javascript
vue和小程序项目中使用iconfont的方法
2020/05/19 Javascript
python3.5 + PyQt5 +Eric6 实现的一个计算器代码
2017/03/11 Python
解决Pandas to_json()中文乱码,转化为json数组的问题
2018/05/10 Python
朴素贝叶斯分类算法原理与Python实现与使用方法案例
2018/06/26 Python
python定向爬虫校园论坛帖子信息
2018/07/23 Python
关于python3中setup.py小概念解析
2019/08/22 Python
python在OpenCV里实现投影变换效果
2019/08/30 Python
python实现简易淘宝购物
2019/11/22 Python
CSS3 linear-gradient线性渐变生成加号和减号的方法
2017/11/21 HTML / CSS
HTML5本地存储之Web Storage详解
2016/07/04 HTML / CSS
澳大利亚电子产品购物网站:Dick Smith
2017/02/02 全球购物
德国电子产品购物网站:TechInTheBasket德国
2018/12/07 全球购物
学生自我鉴定范文
2013/10/04 职场文书
《尊严》教学反思
2014/02/11 职场文书
《一个中国孩子的呼声》教学反思
2014/02/12 职场文书
小学毕业感言500字
2014/02/28 职场文书
2014年文学毕业生自我鉴定
2014/04/23 职场文书
22句经典语录:送给优柔寡断和胡思乱想的朋友们
2019/12/13 职场文书
Ajax是什么?Ajax高级用法之Axios技术
2021/04/21 Javascript