编程 Javascript

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 对象来访问。

语法

所有 HTML 元素都支持。

参数值

值	描述
expression	控制器名。

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

AngularJS ng-controller 指令简单实例

- Author -

lqh

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

判断是否输入完毕再激活提交按钮

Jun 26 Javascript

基于JQuery的一句话搞定手风琴菜单

Sep 14 Javascript

jquery入门—编写一个导航条(可伸缩)

Jan 07 Javascript

js setTimeout 常见问题小结

Aug 13 Javascript

jquery中加载图片自适应大小主要实现代码

Aug 23 Javascript

利用cookie记住背景颜色示例代码

Nov 04 Javascript

Angular.js之作用域scope'@','=','&'实例详解

Feb 28 Javascript

全新打包工具parcel零配置vue开发脚手架

Jan 11 Javascript

Angular设置别名alias的方法

Nov 08 Javascript

zepto.js 实时监听输入框的方法

Dec 04 Javascript

JavaScript实现简单计算器功能

Dec 19 Javascript

微信小程序scroll-view实现滚动到锚点左侧导航栏点餐功能(点击种类,滚动到锚点)

Jun 11 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