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扩展自写的 UI导航
Jan 13 Javascript
使用JavaScript库还是自己写代码?
Jan 28 Javascript
基于jquery的direction图片渐变动画效果
May 24 Javascript
基于jquery 的一个progressbar widge
Oct 29 Javascript
Extjs Label的 fieldLabel和html属性值对齐的方法
Jun 15 Javascript
浅谈angularJS 作用域
Jul 05 Javascript
简单的jQuery拖拽排序效果的实现(增强动态)
Feb 09 Javascript
JavaScript函数表达式详解及实例
May 05 Javascript
jQuery插件FusionCharts绘制的2D双柱状图效果示例【附demo源码】
May 13 jQuery
jQuery查找dom的几种方法效率详解
May 17 jQuery
详解webpack打包vue项目之后生成的dist文件该怎么启动运行
Sep 06 Javascript
js定时器出现第一次延迟的原因及解决方法
Jan 04 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
基于ubuntu下nginx+php+mysql安装配置的具体操作步骤
2013/04/28 PHP
php 判断是否是中文/英文/数字示例代码
2013/09/30 PHP
PHP生成网站桌面快捷方式代码分享
2014/10/11 PHP
Zend Framework教程之Zend_Config_Ini用法分析
2016/03/23 PHP
通过jquery实现tab标签浏览效果
2007/02/20 Javascript
js静态方法与实例方法分析
2011/07/04 Javascript
javascript实现的平方米、亩、公顷单位换算小程序
2014/08/11 Javascript
常用的JavaScript WEB操作方法分享
2015/02/28 Javascript
浅析JavaScript事件和方法
2015/02/28 Javascript
jQuery EasyUI API 中文帮助文档和扩展实例
2016/08/01 Javascript
Node.js检测端口(port)是否被占用的简单示例
2016/09/29 Javascript
JS中Select下拉列表类(支持输入模糊查询)功能
2017/01/17 Javascript
Angular.JS通过指令操作DOM的方法
2017/05/10 Javascript
详解关于微信setData回调函数中的坑
2019/02/18 Javascript
javascript中call,apply,bind的区别详解
2020/12/11 Javascript
python BeautifulSoup使用方法详解
2013/11/21 Python
Django中模型Model添加JSON类型字段的方法
2015/06/17 Python
利用matplotlib+numpy绘制多种绘图的方法实例
2017/05/03 Python
python命令行解析之parse_known_args()函数和parse_args()使用区别介绍
2018/01/24 Python
python实现图书管理系统
2018/03/12 Python
python使用pygame模块实现坦克大战游戏
2020/03/25 Python
numpy.meshgrid()理解(小结)
2019/08/01 Python
Python 简单计算要求形状面积的实例
2020/01/18 Python
使用OpenCV对车道进行实时检测的实现示例代码
2020/06/19 Python
利用CSS的Sass预处理器(框架)来制作居中效果
2016/03/10 HTML / CSS
电信专业应届生自荐信
2013/09/28 职场文书
个人教师自我评价范文
2013/12/02 职场文书
亲戚结婚的请假条
2014/02/11 职场文书
3分钟演讲稿
2014/04/30 职场文书
运动会演讲稿200字
2014/08/25 职场文书
2014年教育实习工作总结
2014/11/22 职场文书
2014年度个人工作总结范文
2015/03/09 职场文书
三八节祝酒词
2015/08/11 职场文书
​(迎国庆)作文之我爱我的祖国
2019/09/19 职场文书
Ruby GDBM操作简介及数据存储原理
2022/04/19 Ruby
使用Python开发冰球小游戏
2022/04/30 Python