<!DOCTYPE html>
<html lang="en" ng-app="todolist">
<head>
<meta charset="UTF-8">
<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css"/>
<script src="js/jquery-1.9.1.min.js" type="text/javascript" charset="utf-8"></script>
<script src="js/bootstrap.min.js" type="text/javascript" charset="utf-8"></script>
<title>web应用</title>
</head>
<body ng-controller='taskctrl' style="padding: 10px;">
<div class="input-group" >
<input type="text" name="" id="" value="" class="form-control" ng-model="task"/>
<span id="" class="input-group-btn">
<button class="btn btn-default" ng-click="add()">提交</button>
</span>
</div>
<h4 ng-if="tasks.length>0">任务列表</h4>  //ng-if="tasks.length是指数组长度为0的时候不显示任务列表字样 ，也可以使用 ng-                       hide="tasks.length==0",ng-if是满足条件才生成，ng-hide是生成之后条件满足后隐藏，建议使用ng-if
<ul class="list-group">
<li ng-repeat="item in tasks track by $index" class="list-group-item">{{item}}<a ng-click="tasks.splice($index,1)" class="pull-right">删除</a></li> //track by $index是可以在任务列表中展示同样内容的li,tasks.splice($index,1)是可以删除一整行li

</ul>
</body>
<script src="js/angular.min.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
angular.module('todolist',[])
.controller('taskctrl',function($scope){
$scope.task="";
$scope.tasks=[];
$scope.add=function(){
$scope.tasks.push($scope.task);
}
});
</script>
</html>

Angularjs做的一个小页面的更多相关文章

  1. FMX相当于在界面上自己又做了一个小操作系统

    FMX的自画界面我也不看好,比如复制粘贴,太丑了,系统做得很好很精细的复制粘贴界面,就是无法调出,比如MIUI,复制粘贴还能有个放大镜,可以选择到屏幕边缘的文字,可以选择剪贴板内多个可粘贴的文字:还有 ...

  2. 加班两个星期做的一个小系统~（winform）

    不管怎么样~加班两个星期,单独一人,努力将公司需要用的系统给做出来了,也感谢提供技术帮助的可爱人儿~ 首先,系统有个检测版本的功能,若版本不是最新的,则会自动更新(公司要求,必须强制更新)~ 更新界面 ...

  3. DOM的利用冒泡做的一个小程序

    我们都知道DOM的事件流,有冒泡事件,如何有效的利用冒泡? 优化:应该尽量少的添加事件监听:原理:每添加一个事件监听事件,就会在浏览器中添加一个EventListener,如果数量过多,浏览器只能一个 ...

  4. 基于Tkinter以及百度翻译爬虫做的一个小的翻译软件

    首先看效果: 输入Hello, 可见输出 int. 打招呼 下面看源码: from tkinter import * import requests# 首先导入用到的库 request = reque ...

  5. 对于xss等有关的html，url，unicode编码做的一个小总结。

    参考:http://bobao.360.cn/learning/detail/292.html,算是对前部分作一个总结性的学习. 1<a href="%6a%61%76%61%73%6 ...

  6. 自己做的一个小demo

    上图: 主段代码: <script type="text/javascript"> var getRandomColor = function(){ return (f ...

  7. 用Unity做的一个小游戏，仿照一个样例写的，个人认为文章写的不错，哈哈

  8. 今天用C#做的一个小的注册练习

    下边是实现的代码: using System;using System.Collections.Generic;using System.ComponentModel;using System.Dat ...

  9. jquery做一个小的轮播插件---有BUG，后续修改

    //首页无缝轮播 ; (function($, window, document, undefined) { $.fn.slider = function(options) { var default ...

随机推荐

  1. mac 启动apache服务

    启动服务:sudo /usr/sbin/apachectl start 停止服务:sudo /usr/sbin/apachectl stop 重启服务:sudo /usr/sbin/apachectl ...

  2. Interlocked系列函数线程同步的缺陷

    1. Code int Work() { while (m_lInterlockedData < 10) { InterlockedIncrement(&m_lInterlockedDa ...

  3. CETV面试总结

    在通过CETV的网上笔试之后,我收到了面试通知,我纠结片刻,就买了第二天去广州的高铁,虽然感觉自己硬件方面的知识已经快忘完了,但还是想去一下,起码是一种经历.对一个路痴和知识储备不足的我来讲,这一切都 ...

  4. UVA 11800 Determine the Shape --凸包第一题

    题意: 给四个点,判断四边形的形状.可能是正方形,矩形,菱形,平行四边形,梯形或普通四边形. 解法: 开始还在纠结怎么将四个点按序排好,如果直接处理的话,有点麻烦,原来凸包就可搞,直接求个凸包,然后点 ...

  5. Vijos1046观光旅游[floyd 最小环]

    背景 湖南师大附中成为百年名校之后,每年要接待大批的游客前来参观.学校认为大力发展旅游业,可以带来一笔可观的收入. 描述 学校里面有N个景点.两个景点之间可能直接有道路相连,用Dist[I,J]表示它 ...

  6. HTML:图片热点 网页划区 表单

    图片热点: 划出图片中的区域,做超链接,点击该区域就可以直接跳转到链接网站 <img src="../../../3.jpg" title="血精灵" u ...

  7. Linux混杂设备驱动学习

    Linux混杂设备是字符设备的一类,主要是混杂设备拥有相同的主设备号(10),但是次设备号是不同的.所有的混杂设备行程一个链表,对设备访问时内核更据次设备号查找到相应的混杂设备. 混杂设备用struc ...

  8. linux系统root密码遗忘的情况下的解决办法

    机房一台centos系统的服务器,由于这台服务器的系统装了好长时间,且root密码中间更新过几次,后面去机房现场维护时,登陆密码遗忘了,悲催啊~ 没办法,只能开机进入“单用户模式”进行密码重置了. 下 ...

  9. javascript中的链表结构—双向链表

    1.概念 上一个文章里我们已经了解到链表结构,链表的特点是长度不固定,不用担心插入新元素的时候新增位置的问题.插入一个元素的时候,只要找到插入点就可以了,不需要整体移动整个结构. 这里我们了解一下双向 ...

  10. WIN7下强制分第四个主分区的方法

    通过磁盘管理的界面方式, 第四个分区会被分成扩展分区, 建议通过命令行 打开命令行运行diskpart, list disk 会列出所有磁盘, 选择要操作的磁盘序号如1,select disk 1 如 ...