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 相关文章推荐
IE6,IE7,IE8下使用Javascript记录光标选中范围(已补全)
Aug 28 Javascript
JavaScript NodeTree导航栏(菜单项JSON类型/自制)
Feb 01 Javascript
js实现的折叠导航示例
Nov 29 Javascript
Javascript6中字符串的四个新用法分享
Sep 11 Javascript
JS中对数组元素进行增删改移的方法总结
Dec 15 Javascript
基于Bootstrap 3 JQuery及RegExp的表单验证功能
Feb 16 Javascript
Bootstrap table使用方法总结
May 10 Javascript
Node.js使用MySQL连接池的方法实例
Feb 11 Javascript
详解适配器在JavaScript中的体现
Sep 28 Javascript
angularJs select绑定的model取不到值的解决方法
Oct 08 Javascript
详解webpack 最简打包结果分析
Feb 20 Javascript
Vue实现跑马灯样式文字横向滚动
Nov 23 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 IP及IP段进行访问限制的代码
2008/12/17 PHP
用mysql内存表来代替php session的类
2009/02/01 PHP
Ajax+PHP边学边练 之五 图片处理
2009/12/03 PHP
php 备份数据库代码(生成word,excel,json,xml,sql)
2013/06/23 PHP
PHP+MySQL插入操作实例
2015/01/21 PHP
JavaScript 格式字符串的应用
2010/03/29 Javascript
Bootstrap每天必学之表单
2015/11/23 Javascript
jQuery实现动态添加tr到table的方法
2016/12/26 Javascript
利用JS实现简单的日期选择插件
2017/01/23 Javascript
jQuery多选框选择数量限制方法
2017/02/08 Javascript
webpack配置文件和常用配置项介绍
2017/04/28 Javascript
vue项目中用cdn优化的方法
2018/01/03 Javascript
基于游标的分页接口实现代码示例
2018/11/12 Javascript
Vue 中获取当前时间并实时刷新的实现代码
2020/05/12 Javascript
用python删除java文件头上版权信息的方法
2014/07/31 Python
Python读取ini文件、操作mysql、发送邮件实例
2015/01/01 Python
使用Python的判断语句模拟三目运算
2015/04/24 Python
python调用java模块SmartXLS和jpype修改excel文件的方法
2015/04/28 Python
Python找出list中最常出现元素的方法
2016/06/14 Python
Python更新数据库脚本两种方法及对比介绍
2017/07/27 Python
python实现数据预处理之填充缺失值的示例
2017/12/22 Python
基于python生成器封装的协程类
2019/03/20 Python
Python中判断子串存在的性能比较及分析总结
2019/06/23 Python
解决python中import文件夹下面py文件报错问题
2020/06/01 Python
Python flask框架如何显示图像到web页面
2020/06/03 Python
Python 没有main函数的原因
2020/07/10 Python
css3.0新属性效果在ie下的解决方案
2010/05/10 HTML / CSS
HTML5 Canvas渐进填充与透明实现图像的Mask效果
2013/07/11 HTML / CSS
Sephora丝芙兰马来西亚官方网站:国际化妆品购物
2018/03/15 全球购物
在DELPHI中调用存储过程和使用内嵌SQL哪种方式更好
2016/11/22 面试题
中国文明网签名寄语
2014/01/18 职场文书
快餐公司创业计划书
2014/04/29 职场文书
商务邀请函
2015/01/30 职场文书
SpringBoot中HttpSessionListener的简单使用方式
2022/03/17 Java/Android
virtualenv隔离Python环境的问题解析
2022/06/21 Python
win7配置本地ftp服务器的图文教程
2022/08/05 Servers