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 有趣而诡异的数组
Apr 06 Javascript
Javascript全局变量var与不var的区别深入解析
Dec 09 Javascript
DIV随滚动条滚动而滚动的实现代码【推荐】
Apr 12 Javascript
JavaScript获取中英文混合字符串长度的方法示例
Feb 04 Javascript
js下载文件并修改文件名
May 08 Javascript
微信小程序自定义toast的实现代码
Nov 16 Javascript
详解基于iview-ui的导航栏路径(面包屑)配置
Feb 22 Javascript
vue如何截取字符串
May 06 Javascript
前端插件之Bootstrap Dual Listbox使用教程
Jul 23 Javascript
通过layer实现可输入的模态框的例子
Sep 27 Javascript
vue elementUI 表单校验的实现代码(多层嵌套)
Nov 06 Javascript
bootstrap-paginator服务器端分页使用方法详解
Feb 13 Javascript
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
使用无限生命期Session的方法
2006/10/09 PHP
PHP新手上路(八)
2006/10/09 PHP
PHP将整个网站生成HTML纯静态网页的方法总结
2012/02/05 PHP
php提取字符串中网站url地址的方法
2014/12/03 PHP
Yii框架防止sql注入,xss攻击与csrf攻击的方法
2016/10/18 PHP
Laravel接收前端ajax传来的数据的实例代码
2017/07/20 PHP
PHP下载大文件失败并限制下载速度的实例代码
2019/05/10 PHP
纯JavaScript实现获取onclick、onchange等事件的值
2014/12/29 Javascript
AngularJS中指令的四种基本形式实例分析
2016/11/22 Javascript
canvas绘图不清晰的解决方案
2017/02/28 Javascript
详解Vue 非父子组件通信方法(非Vuex)
2017/05/24 Javascript
JS如何实现在页面上快速定位(锚点跳转问题)
2017/08/14 Javascript
vue 系列——vue2-webpack2框架搭建踩坑之路
2017/12/22 Javascript
vue实现简单的MVVM框架
2018/08/05 Javascript
vue 自定义提示框(Toast)组件的实现代码
2018/08/17 Javascript
Moment.js实现多个同时倒计时
2019/08/26 Javascript
Python二分查找详解
2015/09/13 Python
Python程序中的观察者模式结构编写示例
2016/05/27 Python
Python使用SocketServer模块编写基本服务器程序的教程
2016/07/12 Python
python实现Flappy Bird源码
2018/12/24 Python
如何安装并使用conda指令管理python环境
2019/07/10 Python
python多进程(加入进程池)操作常见案例
2019/10/21 Python
使用Nibabel库对nii格式图像的读写操作
2020/07/01 Python
使用scrapy ImagesPipeline爬取图片资源的示例代码
2020/09/28 Python
Python+logging输出到屏幕将log日志写入文件
2020/11/11 Python
详解pandas apply 并行处理的几种方法
2021/02/24 Python
Vans荷兰官方网站:美国南加州的原创极限运动潮牌
2018/01/23 全球购物
Stio官网:男女、儿童户外服装
2019/12/13 全球购物
运动会广播稿30字
2014/01/21 职场文书
房地产项目策划书
2014/02/05 职场文书
安全演讲稿大全
2014/05/09 职场文书
委托书的格式
2014/08/01 职场文书
社区娱乐活动方案
2014/08/21 职场文书
收入及婚姻状况证明
2014/11/20 职场文书
Pytorch 如何实现常用正则化
2021/05/27 Python
python opencv通过4坐标剪裁图片
2021/06/05 Python