<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<meta http-equiv="X-UA-Compatible"content="IE=edge" />
<meta name="viewport"content="width=device-width,initial-scale=1" />
<title></title>
<meta charset="utf-8" />
<link rel="stylesheet"href="bootstrap-3.3.5/dist/css/bootstrap.min.css" />
</head>
<body data-ng-app="myApp"data-ng-controller="myCtrl">
<div class="container"style="padding:50px">
<form class="form-horizontal">
<div class="form-group">
<label class="col-sm-2 control-label">名：</label>
<div class="col-sm-10">
<input type="text"name="fName"placeholder="名"data-ng-model="fName" />
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">姓：</label>
<div class="col-sm-10">
<input type="text"name="lName"placeholder="姓"data-ng-model="lName" />
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">网络名为：</label>
<div class="col-sm-10">
<span class="col-sm-10">{{fName+lName}}</span>
</div>
</div>

</form>
</div>

<script src="jQuery/jquery-2.1.4.js"></script>
<script src="bootstrap-3.3.5/dist/js/bootstrap.min.js"></script>
<script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script>
<script>
angular.module("myApp", []).controller("myCtrl", function ($scope) { $scope.fName = "melao"; $scope.lName = "2006";})

</script>
</body>
</html>

第一个AngularJS控制器的更多相关文章

  1. AngularJS控制器

    AngularJS 控制器 控制 AngularJS 应用程序的数据,控制器是常规的 JavaScript 对象. 1. angular.module(name, [requires], [confi ...

  2. AngularJS 控制器

    AngularJS 控制器 控制 AngularJS 应用程序的数据. AngularJS 控制器是常规的 JavaScript 对象. AngularJS 控制器 AngularJS 应用程序被控制 ...

  3. AngularJS 控制器 ng-controller

    AngularJS 控制器 控制 AngularJS 应用程序的数据. AngularJS 控制器是常规的 JavaScript 对象. AngularJS 应用程序被控制器控制. ng-contro ...

  4. angularjs控制器之间通信，事件通知服务

    service要记住一点就是所有的services都是singleton(单例)的,service更多的是做一些业务逻辑,数据交互.当然,利用单例这特点也可以用来做不同控制器间的通信.控制器间的通信也 ...

  5. AngularJS 控制器通信

    指令与控制器之间通信,无非是以下几种方法: 基于scope继承的方式 基于event传播的方式 service的方式 基于scope继承的方式 最简单的让控制器之间进行通信的方法是通过scope的继承 ...

  6. AngularJS学习之旅—AngularJS 控制器(六)

    1.AngularJS 控制器 AngularJS 应用程序被控制器控制. ng-controller 指令定义了应用程序控制器. 控制器是 JavaScript 对象,由标准的 JavaScript ...

  7. AngularJS 1.x系列：AngularJS控制器（3）

    1. 控制器(Controller)定义 控制器(Controller)在AngularJS中作用是增强视图(View),AngularJS控制器是一个构造方法,用来向视图(View)中添加额外功能. ...

  8. AngularJS控制器和AngularJS过滤器的学习（3）

    前面简单的学习了AngularJS的表达式和指令,就可以说大概对AngularJS有了一定的了解吧,嘿嘿,下面就来总结学习一下AngularJS的控制器和过滤器哦. 说起来AngularJS控制器,其 ...

  9. 【06】AngularJS 控制器

    AngularJS 控制器 AngularJS 控制器 控制 AngularJS 应用程序的数据. AngularJS 控制器是常规的 JavaScript 对象. AngularJS 控制器 Ang ...

随机推荐

  1. hibernate打印sql日志及参数

    #log4j.properties log4j.rootLogger=info, CA# ConsoleAppenderlog4j.appender.CA=org.apache.log4j.Conso ...

  2. 执行ORACLE SQL时如何 忽略替换变量（转载）

    你想在SQL*Plus里执行一个脚本,脚本里包含了一些看起来像替换变量的元素,但实际上你并不是想把它们当替换变量来处理.这时你想让解析器忽略它们而不是提示用户输入.解决方案1有一种解决方案就是在&am ...

  3. pat1046. Shortest Distance (20)

    1046. Shortest Distance (20) 时间限制 100 ms 内存限制 65536 kB 代码长度限制 16000 B 判题程序 Standard 作者 CHEN, Yue The ...

  4. MVC分页技术

    这个是用的插件分页技术 前台引用和js <script type="text/javascript" src="/js/jquery-1.10.2.min.js&q ...

  5. 使用@Cacheable 踩过的坑

    public class XXX{ @Resourceprivate XXX self;//@Cacheable通过内部调用将不会使用缓存,从Spring4.3开始可以通过注入self,再通过self ...

  6. Spring cloud微服务 Hystrix熔断器学习教程

    以下demo代码:https://github.com/wades2/HystrixtDemo 官网定义:Hystrix是一个延迟容错库.在分布式环境中,许多服务依赖项中的一些不可避免地会失败.Hys ...

  7. .net core 共享 .Net Forms Authentication cookie

    Asp.net 项目迁移到 asp.net core 项目后需要 兼容以前老的项目的登录方式. Forms Authentication cookie 登录. 从网上搜集到关于这个问题的解决思路都没有 ...

  8. Redis数据类型（字符串）

    Redis存放的字符串为二进制是安全的.字符串长度支持到512M. incr 递增数字INCR key 当存储的字符串是整数时,redis提供了一个实用的命令INCR,其作用是让当前键值递增,并返回递 ...

  9. 用canvas绘制一个简易时钟

    在见识了html5中canvas的强大,笔者准备制作一个简易时钟. 下面就是成果啦,制作之前我们先分析一下,绘制一个时钟需要做哪些准备. 一 . 1.首先这个时钟分为表盘,指针(时针,分针,秒针)和数 ...

  10. Android - 开发页面需了解的dip，sp，px知识，以及它们的转换

    工作中,时常会有任务要求开发新页面,这时一般的流程是产品经理确定要开发的页面和功能,然后设计师提供设计稿,之后由我们开发人员完成开发工作. 通常,设计师提供的设计稿尺寸标注会很详细,例如涉及到字时,字 ...