ng-options="item.action for item in todos"

　　ng-options表达式的基本形式， 形如 "<标签> for <项目> in <数组>

　　<option value="">(chosse one) </option>

　　ng-options="item.id as item.action for item in todos"

　　在表单的形式如<所选属性>as <标签> for <变量> in <数组>

　　ng-options="item.action group by item.place for item in todos"

　　将对象进行分组

　　使用无作用域的控制器

　　

 <!DOCTYPE html>

 <html lang="en" ng-app="iApp">

 <head>

     <meta charset="UTF-8">

     <title>Document</title>

     <link rel="stylesheet" href="bower_components/bootstrap/dist/css/bootstrap.css">

     <link rel="stylesheet" href="bower_components/bootstrap/dist/css/bootstrap-theme.css">

     <script src="bower_components/angular/angular.js"></script>

     <script>

         angular.module('iApp',[])

             .controller('topCtrl',function(){

                 this.dataValue='Hello,Adam';

                 this.reverseText=function(){

                     this.dataValue=this.dataValue.split("").reverse().join("");

                 }

             })

     </script>

 </head>

 <body >

     <div class="well" ng-controller="topCtrl as ctrl">

         <h4>Top level Controller</h4>

         <div class="input-group">

             <span class="input-group-btn">

                 <button class="btn btn-default" ng-click="ctrl.reverseText()">Reverse</button>

             </span>

             <input type="text" class="form-control" ng-model="ctrl.dataValue">

         </div>

     </div>

 </body>

 </html>

当应用无作域的控制器时，表达式的格式化形如：<要应用的控制器> as <变量名>

然后在视图中使用ctrl变量访问数据和行为，类似这样：<input.....ng-model="ctrl.dataValue">

AngularJS的一点学习笔记的更多相关文章

  1. Visual Studio 2015 Owin+MVC+WebAPI+ODataV4+EntityFrawork+Identity+Oauth2.0+AngularJS 1.x 学习笔记

    2016年,.net 会有很多大更新 ASP.NET 5 在此之前我都是用着古老的.net做开发的 (WebForm + IIS) 为了接下来应对 .net 的新功能,我特地去学习了一下基本的 MVC ...

  2. AngularJs学习笔记-AngularJS权威教程学习笔记

    AngularJS是什么? AngularJS是一种构建动态Web应用的结构化框架.主要用于构建单页面Web应用, 增加抽象级别,使构建交互式的现代Web应用变得更加简单. AngularJS使开发W ...

  3. Visual Studio 2015 Owin+MVC+WebAPI+ODataV4+EntityFrawork+Identity+Oauth2.0+AngularJS 1.x 学习笔记之"坑"

    1.AngularJS route 与 MVC route http://www.cnblogs.com/usea/p/4211989.html public class SingleRoute : ...

  4. angularJS的一点小笔记

    AngularJS用法:-------------------------------------------------- AngularJS 指令: AngularJS 通过被称为 指令 的新属性 ...

  5. 《AngularJs实战》学习笔记(慕课网)

    1. Controller使用过程中的注意点 不要试图去复用Controller, 一个控制器一般只负责一小块视图 不要在Controller中操作DOM, 这不是控制器的职责. 封装在指令里. 不要 ...

  6. AngularJs 初级入门 学习笔记

    刚学angular, 做一些笔记方便自己翻看. ng-app: 填写模块的名称 ng-init: 初始化数据(一般通过控制器初始化) ng-model: 填写数据模型 ng-bind: 绑定数据模型, ...

  7. Angular【学习笔记】

    1.angular入门网站 感谢@菜鸟教程:http://www.runoob.com/angularjs/angularjs-tutorial.html 学习笔记:

  8. xml基础学习笔记04

    今天继续xml学习,主要是:SimpleXML快速解析文档.xml与数组相互转换 .博客中只是简单的做一个学习记录.积累.更加详细的使用方法,可以查看php手册 1.SimpleXML快速解析文档 前 ...

  9. SQL server2005学习笔记（一）数据库的基本知识、基本操作（分离、脱机、收缩、备份、还原、附加）和基本语法

    在软件测试中,数据库是必备知识,假期闲里偷忙,整理了一点学习笔记,共同探讨. 阅读目录 基本知识 数据库发展史 数据库名词 SQL组成 基本操作 登录数据库操作 数据库远程连接操作 数据库分离操作 数 ...

随机推荐

  1. 第一次Sprint总结

    回顾流程      这次我们做(done)的是设计用户登录界面.注册界面.查询功能.链接数据库等,我们成功地把todo变成了done,首先不管我们结果如何,不管我们的付出是否与收获成正比,但我们做到了 ...

  2. JavaScript 的数据类型 相关知识点

    (1)基本数据类型介绍 JavaScript的数据类型分为两类:原始类型(primitive type)和对象类型(object type) 或者说是:可以拥有方法的类型和不能拥有方法的类型 或者说是 ...

  3. Winform开发框架的重要特性总结

    从事Winform开发框架的研究和推广,也做了有几个年头了,从最初的项目雏形到目前各种重要特性的加入完善,是经过了很多项目的总结归纳和升华,有些则是根据客户需要或者应用前景的需要进行的完善,整个Win ...

  4. c# 文件另存为代码

    利用.NET中的File.Copy方法 命名空间:System.IO 重载列表:Copy(string sourceFilePath,string targetFilePath) sourceFile ...

  5. sencha动态向容器里添加控件出现重叠问题

    sencha动态向容器里添加控件出现重叠问题原因是由于动态生成控件的id有重复导致的.(js取时间到毫秒来做id,放在for里面会出现几个控件id是相同的情况.).解决掉重复id的问题就好了. 版权声 ...

  6. 强大的修改数据库修改语句ALTER　TABLE（一)[20160712]

    今天开始的时间比昨天晚,其实午休的时间是差不多的,只是起来后稍微看了一点新闻,10分钟时间就没有了,所以要养成一个好习惯还真不容易,另外就是工作时间少看新闻,太浪费时间. 昨天在执行一个alter S ...

  7. ztree addNode editName removeNode

    1.ztree api中完全拥有以上操作的相关解释,及简单Demo. 2.主要是要学会将单独的效果组合起来使用. 2.1  如: 添加完新的Node节点之后,怎么立即进入新节点的编辑状态来修改名称(或 ...

  8. Ahjesus Nodejs02 使用集成开发环境

    下载最新版webstorm, 选择此集成开发环境是因为支持性较好,在vs下也有插件支持,不过感觉有些牵强 附vs插件 NTVS 详细介绍 安装好以后就需要配置npm NPM 国内高速镜像 source ...

  9. Java中native的用法

    原文来自:http://blog.csdn.net/funneies/article/details/8949660 native关键字说明其修饰的方法是一个原生态方法,方法对应的实现不是在当前文件, ...

  10. android的Project has no default.properties file! Edit the project properties to set one. 的解决

    网上找来这种方法基本解决: 在我们导入Android工程时,有时候会出现如题所述的错误,打开工程目录可以看到,目录下的default.properties文件没有了或者多出了一个project.pro ...