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 空位补零实现代码
Feb 26 Javascript
jquery $.ajax相关用法分享
Mar 16 Javascript
firefox下jQuery UI Autocomplete 1.8.*中文输入修正方法
Sep 19 Javascript
用Jquery选择器计算table中的某一列某一行的合计
Aug 13 Javascript
JS来动态的修改url实现对url的增删查改
Sep 05 Javascript
javascript中clone对象详解
Dec 03 Javascript
javascript顺序加载图片的方法
Jul 18 Javascript
jQuery实现图片左右滚动特效
Apr 20 Javascript
JS实现仿苹果底部任务栏菜单效果代码
Aug 28 Javascript
JQuery 选择器、DOM节点操作练习实例
Sep 28 jQuery
JS实现将二维数组转为json格式字符串操作示例
Jul 12 Javascript
详解element上传组件before-remove钩子问题解决
Apr 08 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网页游戏学习之Xnova(ogame)源码解读(六)
2014/06/23 PHP
php cookie 详解使用实例
2016/11/03 PHP
thinkphp Apache配置重启Apache1 restart 出错解决办法
2017/02/15 PHP
PHP观察者模式原理与简单实现方法示例
2017/08/25 PHP
thinkphp5框架路由原理与用法详解
2020/02/11 PHP
Javascript实现的鼠标经过时播放声音
2010/05/18 Javascript
JavaScript Accessor实现说明
2010/12/06 Javascript
介绍JavaScript的一个微型模版
2015/06/24 Javascript
JavaScript判断微信浏览器实例代码
2016/06/13 Javascript
JavaScript  event对象整理及详细介绍
2016/10/10 Javascript
Angularjs的启动过程分析
2017/07/18 Javascript
JS返回顶部实例代码
2020/08/09 Javascript
vue2.0使用swiper组件实现轮播效果
2017/11/27 Javascript
React Native之prop-types进行属性确认详解
2017/12/19 Javascript
Node.js实现简单的爬取的示例代码
2019/06/25 Javascript
Vue解决echart在element的tab切换时显示不正确问题
2020/08/03 Javascript
[42:36]DOTA2上海特级锦标赛B组败者赛 VG VS Spirit第二局
2016/02/26 DOTA
[36:20]完美世界DOTA2联赛PWL S3 access vs Rebirth 第一场 12.17
2020/12/18 DOTA
Python实现Kmeans聚类算法
2020/06/10 Python
python的dataframe和matrix的互换方法
2018/04/11 Python
Python清空文件并替换内容的实例
2018/10/22 Python
Linux下安装python3.6和第三方库的教程详解
2018/11/09 Python
详解FireFox下Canvas使用图像合成绘制SVG的Bug
2019/07/10 HTML / CSS
美国一家主营日韩美妆护肤品的在线商店:iMomoko
2016/09/11 全球购物
Marlies Dekkers内衣法国官方网上商店:国际知名的荷兰内衣品牌
2019/03/18 全球购物
澳大利亚顶级美发和美容贸易超市:glamaCo
2020/01/19 全球购物
Sisley法国希思黎美国官方网站:享誉全球的奢华植物美容品牌
2020/06/27 全球购物
机械工程系毕业生求职信
2013/09/27 职场文书
药学专业个人自我评价
2013/11/11 职场文书
点菜员岗位职责范本
2014/02/14 职场文书
2014迎接教师节演讲稿
2014/09/10 职场文书
干部培训简讯
2015/07/20 职场文书
golang中的空接口使用详解
2021/03/30 Python
多人盗宝《绿林侠盗》第三赛季4.5上线 跨平台实装
2022/04/03 其他游戏
mysql sock文件存储了什么信息
2022/07/15 MySQL
CSS list-style-type属性使用方法
2023/05/21 HTML / CSS