<!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>todolist</title>
<meta charset="utf-8" />
<link rel="stylesheet"href="bootstrap-3.3.5/dist/css/bootstrap.min.css" />
</head>
<body data-ng-app="taskApp" data-ng-controller="taskCtrl">
<div class="container"style="padding:50px">
<div class="input-group">
<input type="text"class="form-control" data-ng-model="task"/>
<span class="input-group-btn">
<button class="btn btn-default" data-ng-click="add()">提交</button>
</span>
</div>
<h3 data-ng-if="tasks.length>0">任务列表</h3>
<ul class="list-group">
<li class="list-group-item"data-ng-repeat="item in tasks track by $index">{{item}}<a data-ng-click="tasks.splice($index,1)">删除</a></li>

</ul>
</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("taskApp", []).controller("taskCtrl", function ($scope) {
$scope.task = "";
$scope.tasks = [];
$scope.add = function () {
$scope.tasks.push($scope.task)
}
})
</script>
</body>
</html>

AngularJS web应用程序的更多相关文章

  1. 25个超有用的 AngularJS Web 开发工具

    AngularJS是为了克服HTML在构建应用上的不足而设计的.HTML是一门很好的为静态文本展示设计的声明式语言,改善了JavaScript. 下面我要说的就是25个超有用的AngularJS工具, ...

  2. web前端程序员真的值这么多钱吗？

    对于互联网公司来说用户就是上帝,做好客户体验一切才有可能.所以互联网公司都会把钱砸向前端,Web前端程序员也越来越受到企业争相聘用. 前端工程师工资也越来越高,目前Web前端工程师工作1~2年后通常会 ...

  3. AngularJs + Web API 页面开发（一）

    AngularJS这个JS框架是个神马东东我也不太清楚,我也是初学者~~ AngularJS适用于single page App,单页面程序都是局部刷新的,这一点和Ajax有第一的区别,因为使用Aja ...

  4. 目前在做的一个web应用程序的前端选型

    最近进入了一个新的项目组,要新起一个项目.这个Web项目是一个企业内部使用的系统,主要用来记录.追踪.管理潜在客户的数据.该系统有以下特点: 需要支持IE10及以上版本: 后端采用micro serv ...

  5. Web标准中用于改善Web应用程序性能的各种方法总结

    提起Web应用程序中的性能改善,广大开发者们可能会想到JavaScript与DOM访问等基于各种既存技术的性能改善方法.最近,各种性能改善方法被汇总成为一个Web标准. 本文对Web标准中所包含的各种 ...

  6. Angularjs web应用

    构建兼容浏览器的Angularjs web应用 背景 随着mvvm逐渐成熟,现在使用jQuery构建web应用已经显得过时了,而且使用jQuery需要编写更多的代码去控制dom的取值.赋值.绑定事件等 ...

  7. 5个最好用AngularJS构建应用程序框架

    如果你打算建立自己的Web应用与AngularJS,那么现在是时候开始了.如果这个想法吓到你了,删除所有的恐慌,从你的头脑中有一些框架,AngularJS提供方便的支持.有一些预先的框架,使用框架可以 ...

  8. ASP.NET Core 中文文档 第二章 指南（3）用 Visual Studio 发布一个 Azure 云 Web 应用程序

    原文:Getting Started 作者:Rick Anderson 翻译:谢炀(Kiler) 校对:孟帅洋(书缘).刘怡(AlexLEWIS).何镇汐 设置开发环境 安装最新版本的 Azure S ...

  9. vs2012 发布web应用程序

    Visual Studio 2012 Visual Studio Express 2012 for Web 与 的Visual Studio 2010  Visual Studio Web发布更新 与 ...

随机推荐

  1. IBM Rational Appscan: Part 2 ---reference

    http://resources.infosecinstitute.com/appscan-part-2/ By Rohit T|August 16th, 2012 ----------------- ...

  2. [转] CentOS下添加用户并且让用户获得root权限

    http://www.centoscn.com/CentOS/config/2014/0810/3471.html 1.添加用户,首先用adduser命令添加一个普通用户,命令如下: #adduser ...

  3. bzoj 3576: [Hnoi2014]江南乐

    Description 小A是一个名副其实的狂热的回合制游戏玩家.在获得了许多回合制游戏的世界级奖项之后,小A有一天突然想起了他小时候在江南玩过的一个回合制游戏. 游戏的规则是这样的,首先给定一个数F ...

  4. 净推荐值（NPS）：用户忠诚度测量的基本原理及方法

    文章分享了一个衡量用户与产品或服务之间关系的指标:NPS,干货满满,希望对你有益. 初识NPS 作为互联网行业的用户体验从业者,我们都或多或少会接触一些衡量用户与产品或服务之间关系的指标,常见的指标如 ...

  5. 利用Filter实现session拦截

    1.在web.xml中配置 <!-- Session监听器 --> <filter> <filter-name>sessionValidateFilter</ ...

  6. hdu 1513 添最少字回文 (Lcs 滚动数组)

    http://blog.csdn.net/ice_crazy/article/details/8244639 这里5000*5000超出内存,所以需要用滚动数组: 用一个now表示当前的结果,pre表 ...

  7. 软件测试技术lab2——Selenium上机实验

    Selenium上机实验说明 1.安装SeleniumIDE插件 2.学会使用SeleniumIDE录制脚本和导出脚本 3.访问http://121.193.130.195:8080/使用学号登录系统 ...

  8. TypeScript 入门笔记

    1.原始数据类型 JavaScript 的类型分为两种:原始数据类型和对象数据类型.原始数据类型包括布尔值.数值.字符串.null.undefined 以及 ES6 中的 Symbol. 前五种数据类 ...

  9. js异步流程控制-回调

    f1为耗时操作,f2依赖f1的数据,因此f2必须在f1之后执行: 个人理解是:将f2(回调函数)的代码放在异步函数内部的最后执行,相当于把同步操作的代码融合到异步函数内部的最后: let tag = ...

  10. es6新语法的使用

    1.声明变量: let 声明变量 作用域代码块作用域{} 尽在模块 先使用后声明 会报错 { let a= 12; alert(a) } let 不允许重复声明同一个变量 const 声明是一个常量, ...