AngularJS ng-controller 指令简单实例


Posted in Javascript onAugust 01, 2016

AngularJS ng-controller 指令

AngularJS 实例

为应用变量添加控制器:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script>
</head>
<body>

<div ng-app="myApp" ng-controller="myCtrl">

Full Name: {{firstName + " " + lastName}}

</div>

<script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
  $scope.firstName = "John";
  $scope.lastName = "Doe";
});
</script>

<p>该实例演示了如何定义一个控制器及 scope 的使用。</p>

</body>
</html>

运行结果:

Full Name: John Doe

该实例演示了如何定义一个控制器及 scope 的使用。

定义和用法

ng-controller 指令用于为你的应用添加控制器。

在控制器中,你可以编写代码,制作函数和变量,并使用 scope 对象来访问。

语法

<element ng-controller="expression"></element>

所有 HTML 元素都支持。

参数值

描述
expression 控制器名。

希望能帮助学习AngularJS的同学,后续继续补充相关知识。

Javascript 相关文章推荐
javascript下阻止表单重复提交、防刷新、防后退
Aug 17 Javascript
一个基于jquery的图片切换效果
Jul 06 Javascript
js delete 用法(删除对象属性及变量)
Aug 24 Javascript
让JavaScript和其它资源并发下载的方法
Oct 16 Javascript
关于在Servelet中如何获取当前时间的操作方法
Jun 28 Javascript
AngularJS过滤器filter用法实例分析
Nov 04 Javascript
利用浮层使select不可选的实现方法
Dec 03 Javascript
jQuery图片轮播(二)利用构造函数和原型创建对象以实现继承
Dec 06 Javascript
JQuery判断正整数整理小结
Aug 21 jQuery
微信小程序实现手指触摸画板
Jul 09 Javascript
vue项目前端微信JSAPI与外部H5支付相关实现过程及常见问题
Apr 14 Javascript
详解如何在vue+element-ui的项目中封装dialog组件
Dec 11 Vue.js
js实现千分符和保留几位小数的简单实例
Aug 01 #Javascript
浅谈jQuery中ajaxPrefilter的应用
Aug 01 #Javascript
AngularJS基础 ng-cloak 指令简单示例
Aug 01 #Javascript
全面接触神奇的Bootstrap导航条实战篇
Aug 01 #Javascript
JavaScript数值千分位格式化的两种简单实现方法
Aug 01 #Javascript
第一次接触神奇的Bootstrap菜单和导航
Aug 01 #Javascript
AngularJS基础 ng-click 指令示例代码
Aug 01 #Javascript
You might like
PHP与javascript对多项选择的处理
2006/10/09 PHP
PHP 程序员的调试技术小结
2009/11/15 PHP
php强制下载类型的实现代码
2011/04/21 PHP
PHP中使用Imagick操作PSD文件实例
2015/01/26 PHP
yii插入数据库防并发的简单代码
2017/05/27 PHP
PHP封装的page分页类定义与用法完整示例
2018/12/24 PHP
利用js对象弹出一个层
2008/03/26 Javascript
对 jQuery 中 data 方法的误解分析
2014/06/18 Javascript
js实现一个链接打开两个链接地址的方法
2015/05/12 Javascript
nodejs微信公众号支付开发
2016/09/19 NodeJs
如何在AngularJs中调用第三方插件库
2017/05/21 Javascript
node.js利用mongoose获取mongodb数据的格式化问题详解
2017/10/06 Javascript
javascript浏览器用户代理检测脚本实现方法
2017/10/27 Javascript
vue 文件目录结构详解
2017/11/24 Javascript
vue-cli3自动消除console.log()的调试信息方式
2020/10/21 Javascript
一则python3的简单爬虫代码
2014/05/26 Python
Python爬虫辅助利器PyQuery模块的安装使用攻略
2016/04/24 Python
浅谈使用Python内置函数getattr实现分发模式
2018/01/22 Python
python实现12306抢票及自动邮件发送提醒付款功能
2018/03/08 Python
python发送邮件脚本
2018/05/22 Python
Python爬虫之正则表达式的使用教程详解
2018/10/25 Python
详解pandas安装若干异常及解决方案总结
2019/01/10 Python
基于python实现MQTT发布订阅过程原理解析
2020/07/27 Python
python用Configobj模块读取配置文件
2020/09/26 Python
英国高街品牌:Miss Selfridge(塞尔弗里奇小姐)
2016/09/21 全球购物
Superdry瑞典官网:英国日本街头风品牌
2017/05/17 全球购物
TIME时代杂志台湾总代理:台时亚洲
2018/10/22 全球购物
彪马俄罗斯官网:PUMA俄罗斯
2019/07/13 全球购物
C#中类(class)与结构(struct)的异同
2013/11/03 面试题
JSP和Servlet有哪些相同点和不同点,他们之间的联系是什么?
2015/10/22 面试题
药学专业个人自我评价
2013/11/11 职场文书
争当四好少年演讲稿
2014/09/13 职场文书
2014年度培训工作总结
2014/11/27 职场文书
六一儿童节主持开场白
2015/05/28 职场文书
辩论赛新闻稿
2015/07/17 职场文书
python3实现无权最短路径的方法
2021/05/12 Python