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 相关文章推荐
不使用中间变量,交换int型的 a, b两个变量的值。
Oct 29 Javascript
js 幻灯片的实现
Dec 06 Javascript
Javascript中 关于prototype属性实现继承的原理图
Apr 16 Javascript
JS实现网页标题栏显示当前时间和日期的完整代码
Nov 02 Javascript
浅析Javascript ES6中的原生Promise
Aug 25 Javascript
jQuery简介_动力节点Java学院整理
Jul 04 jQuery
最通俗易懂的javascript变量提升详解
Aug 05 Javascript
Vue2.0设置全局样式(less/sass和css)
Nov 18 Javascript
使用rollup打包JS的方法步骤
Dec 05 Javascript
jQuery - AJAX load() 实例用法详解
Aug 27 jQuery
SpringBoot+Vue开发之Login校验规则、实现登录和重置事件
Oct 19 Javascript
浅谈Vue开发人员的7个最好的VSCode扩展
Jan 20 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
IP攻击升级,程序改进以对付新的攻击
2010/11/23 PHP
跟我学Laravel之路由
2014/10/15 PHP
php中socket通信机制实例详解
2015/01/03 PHP
PHP7.0安装笔记整理
2015/08/28 PHP
教你php如何实现验证码
2016/01/20 PHP
PHP6新特性分析
2016/03/03 PHP
PHP实践教程之过滤、验证、转义与密码详解
2017/07/24 PHP
php实现的证件照换底色功能示例【人像抠图/换背景图】
2020/05/29 PHP
JS类定义原型方法的两种实现的区别评论很多
2007/09/12 Javascript
Javascript遍历table中的元素示例代码
2014/07/08 Javascript
JavaScript实现计算字符串中出现次数最多的字符和出现的次数
2015/03/12 Javascript
javascript解析xml实现省市县三级联动的方法
2015/07/25 Javascript
asp.net中oracle 存储过程(图文)
2015/08/12 Javascript
bootstrap datetimepicker实现秒钟选择下拉框
2017/01/05 Javascript
Vue.js 插件开发详解
2017/03/29 Javascript
p5.js入门教程之平滑过渡(Easing)
2018/03/16 Javascript
详解ES6 Promise的生命周期和创建
2019/08/18 Javascript
小程序跳转到的H5页面再跳转回跳小程序的方法
2020/03/06 Javascript
javascript设计模式 ? 桥接模式原理与应用实例分析
2020/04/13 Javascript
element-ui中el-upload多文件一次性上传的实现
2020/12/02 Javascript
[47:36]Optic vs Newbee 2018国际邀请赛小组赛BO2 第二场 8.17
2018/08/18 DOTA
[01:52]PWL S2开团时刻第四期——DOTA2成语故事
2020/12/03 DOTA
Python实现将罗马数字转换成普通阿拉伯数字的方法
2017/04/19 Python
2019 Python最新面试题及答案16道题
2019/04/11 Python
Java爬虫技术框架之Heritrix框架详解
2020/07/22 Python
html5使用canvas压缩图片的示例代码
2018/09/11 HTML / CSS
Shopbop中文官网:美国亚马逊旗下时尚购物网站
2020/12/15 全球购物
Linux操作面试题
2012/05/16 面试题
3.15国际消费者权益日主题活动活动总结
2014/03/16 职场文书
大学竞选班干部演讲稿
2014/08/21 职场文书
庆七一活动总结
2014/08/27 职场文书
运动会加油稿100字
2014/09/19 职场文书
教师党员学习十八届四中全会思想汇报
2014/11/03 职场文书
淮阳太昊陵导游词
2015/02/10 职场文书
教你使用Python获取QQ音乐某个歌手的歌单
2022/04/03 Python
vue3种table表格选项个数的控制方法
2022/04/14 Vue.js