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 检测浏览器类型和版本的代码
Sep 15 Javascript
Jquery中children与find之间的区别详细解析
Nov 29 Javascript
JS弹出可拖拽可关闭的div层完整实例
Feb 13 Javascript
JS的框架Polymer中的dom-if和is属性使用说明
Jul 29 Javascript
JavaScript类型系统之基本数据类型与包装类型
Jan 06 Javascript
js实现ctrl+v粘贴上传图片(兼容chrome、firefox、ie11)
Mar 09 Javascript
JavaScript算法系列之快速排序(Quicksort)算法实例详解
Sep 04 Javascript
javascript动画之模拟拖拽效果篇
Sep 26 Javascript
详解javascript中对数据格式化的思考
Jan 23 Javascript
基于vue2.0+vuex+localStorage开发的本地记事本示例
Feb 28 Javascript
Vue.js结合Ueditor富文本编辑器的实例代码
Jul 11 Javascript
Vue $mount实战之实现消息弹窗组件
Apr 22 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
ninety plus是什么?ninety plus咖啡好吗?
2021/03/04 新手入门
eWebEditor v3.8 商业完整版 (PHP)
2006/12/06 PHP
php控制linux服务器常用功能 关机 重启 开新站点等
2012/09/05 PHP
php网站被挂木马后的修复方法总结
2014/11/06 PHP
浅谈PHP解析URL函数parse_url和parse_str
2014/11/11 PHP
Laravel框架中VerifyCsrfToken报错问题的解决
2017/08/30 PHP
ThinkPHP3.2框架自定义配置和加载用法示例
2018/06/14 PHP
php实现生成PDF文件的方法示例【基于FPDF类库】
2018/07/21 PHP
js获取html参数及向swf传递参数应用介绍
2013/02/18 Javascript
自己写了一个展开和收起的多更能型的js效果
2013/03/05 Javascript
jquery将一个表单序列化为一个对象的方法
2014/01/03 Javascript
JavaScript中的Math 使用介绍
2014/04/21 Javascript
基于NodeJS的前后端分离的思考与实践(四)安全问题解决方案
2014/09/26 NodeJs
详解jQuery UI库中文本输入自动补全功能的用法
2016/04/23 Javascript
javascript 中关于array的常用方法详解
2017/05/05 Javascript
vue快捷键与基础指令详解
2017/06/01 Javascript
javascript 中事件冒泡和事件捕获机制的详解
2017/09/01 Javascript
基于webpack-hot-middleware热加载相关错误的解决方法
2018/02/22 Javascript
react build 后打包发布总结
2018/08/24 Javascript
JS原型和原型链原理与用法实例详解
2020/02/05 Javascript
Vue实现计算器计算效果
2020/08/17 Javascript
python使用pygame框架实现推箱子游戏
2018/11/20 Python
如何实现Django Rest framework版本控制
2019/07/25 Python
python os.path.isfile 的使用误区详解
2019/11/29 Python
对Pytorch 中的contiguous理解说明
2021/03/03 Python
关于前端上传文件全面基础扫盲贴(入门)
2019/08/01 HTML / CSS
html5 Canvas画图教程(3)—canvas出现1像素线条模糊不清的原因
2013/01/09 HTML / CSS
Kent & Curwen:与大卫·贝克汉姆合作
2017/06/13 全球购物
AMAVII眼镜官网:时尚和设计师太阳镜
2019/05/05 全球购物
华为消费者德国官方网站:HUAWEI德国
2020/11/03 全球购物
上海雨人软件技术开发有限公司测试题
2015/07/14 面试题
医药营销个人求职信范文
2014/02/07 职场文书
《小熊住山洞》教学反思
2014/02/21 职场文书
部队2015年终工作总结
2015/04/02 职场文书
python tkinter模块的简单使用
2021/04/07 Python
JS的深浅复制详细
2021/10/16 Javascript