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实现划词标记+划词搜索功能
Mar 06 Javascript
ajax java 实现自动完成功能
Dec 19 Javascript
jQuery筛选器children()案例详解(图文)
Feb 17 Javascript
jquery快捷动态绑定键盘事件的操作函数代码
Oct 17 Javascript
使用JavaScript的AngularJS库编写hello world的方法
Jun 23 Javascript
JavaScript实现弹出DIV层同时页面背景渐变成半透明效果
Mar 25 Javascript
javascript原型继承工作原理和实例详解
Apr 07 Javascript
javascript中Date对象应用之简易日历实现
Jul 12 Javascript
javascript入门之window对象【新手必看】
Nov 22 Javascript
Node.js 中exports 和 module.exports 的区别
Mar 14 Javascript
layer.open 按钮的点击事件关闭方法
Aug 17 Javascript
js new Date()实例测试
Oct 31 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 开发环境配置(Zend Studio)
2010/04/28 PHP
PHP实现多级分类生成树的方法示例
2017/02/07 PHP
PHP基于GD库实现的生成图片缩略图函数示例
2017/07/05 PHP
基于jQuery的获得各种控件Value的方法
2010/11/19 Javascript
JS上传图片前的限制包括(jpg jpg gif及大小高宽)等
2012/12/19 Javascript
jQuery中clearQueue()方法用法实例
2014/12/29 Javascript
使用Node.js实现HTTP 206内容分片的教程
2015/06/23 Javascript
JS+DIV+CSS排版布局实现美观的选项卡效果
2015/10/10 Javascript
Javascript 5种方法实现过滤删除前后所有空格
2016/06/22 Javascript
关于JavaScript中事件绑定的方法总结
2016/10/26 Javascript
jquery.validate[.unobtrusive]和Bootstrap实现tooltip错误提示问题分析
2016/10/30 Javascript
Jquery遍历筛选数组的几种方法和遍历解析json对象,Map()方法详解以及数组中查询某值是否存在
2019/01/18 jQuery
VuePress 静态网站生成方法步骤
2019/02/14 Javascript
JS实现指定区域的全屏显示功能示例
2019/04/25 Javascript
element-ui 弹窗组件封装的步骤
2021/01/22 Javascript
Python探索之实现一个简单的HTTP服务器
2017/10/28 Python
python学习--使用QQ邮箱发送邮件代码实例
2019/04/16 Python
PyCharm 配置远程python解释器和在本地修改服务器代码
2019/07/23 Python
python实现跨excel sheet复制代码实例
2020/03/03 Python
python绘制雷达图实例讲解
2021/01/03 Python
Probikekit日本:自行车套件,跑步和铁人三项装备
2017/04/03 全球购物
FC-Moto丹麦:欧洲最大的摩托车服装和头盔商店之一
2019/08/20 全球购物
大学运动会入场词
2014/02/22 职场文书
法律进社区实施方案
2014/03/21 职场文书
继承公证书
2014/04/09 职场文书
软件售后服务承诺书
2014/05/21 职场文书
企业委托书范本
2014/09/13 职场文书
教师节横幅标语
2014/10/08 职场文书
欠款纠纷起诉状
2015/05/19 职场文书
2015年劳动部工作总结
2015/05/23 职场文书
美丽心灵观后感
2015/06/01 职场文书
在职证明范本
2015/06/15 职场文书
三八节祝酒词
2015/08/11 职场文书
Nginx反爬虫策略,防止UA抓取网站
2021/03/31 Servers
Golang二维切片初始化的实现
2021/04/08 Golang
OpenCV-Python 实现两张图片自动拼接成全景图
2021/06/11 Python