Angularjs做的一个小页面
<!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做的一个小页面的更多相关文章
- FMX相当于在界面上自己又做了一个小操作系统
FMX的自画界面我也不看好,比如复制粘贴,太丑了,系统做得很好很精细的复制粘贴界面,就是无法调出,比如MIUI,复制粘贴还能有个放大镜,可以选择到屏幕边缘的文字,可以选择剪贴板内多个可粘贴的文字:还有 ...
- 加班两个星期做的一个小系统~（winform）
不管怎么样~加班两个星期,单独一人,努力将公司需要用的系统给做出来了,也感谢提供技术帮助的可爱人儿~ 首先,系统有个检测版本的功能,若版本不是最新的,则会自动更新(公司要求,必须强制更新)~ 更新界面 ...
- DOM的利用冒泡做的一个小程序
我们都知道DOM的事件流,有冒泡事件,如何有效的利用冒泡? 优化:应该尽量少的添加事件监听:原理:每添加一个事件监听事件,就会在浏览器中添加一个EventListener,如果数量过多,浏览器只能一个 ...
- 基于Tkinter以及百度翻译爬虫做的一个小的翻译软件
首先看效果: 输入Hello, 可见输出 int. 打招呼 下面看源码: from tkinter import * import requests# 首先导入用到的库 request = reque ...
- 对于xss等有关的html，url，unicode编码做的一个小总结。
参考:http://bobao.360.cn/learning/detail/292.html,算是对前部分作一个总结性的学习. 1<a href="%6a%61%76%61%73%6 ...
- 自己做的一个小demo
上图: 主段代码: <script type="text/javascript"> var getRandomColor = function(){ return (f ...
- 用Unity做的一个小游戏，仿照一个样例写的，个人认为文章写的不错，哈哈
- 今天用C#做的一个小的注册练习
下边是实现的代码: using System;using System.Collections.Generic;using System.ComponentModel;using System.Dat ...
- jquery做一个小的轮播插件---有BUG，后续修改
//首页无缝轮播 ; (function($, window, document, undefined) { $.fn.slider = function(options) { var default ...
随机推荐
- Angular+Flask搭建一个记录工具
平时用的最多的文本编辑器就是Notepad++,很多东西都是通过Notepad++直接记录的: 没有看完的网页链接 要整理.收藏的网页 读书笔记 要处理的事情 待看/看过的文档和电子书 等等... 随 ...
- 在一周内学会使用 AUTO CAD
学习目的: 1.使用AUTO CAD绘制电路板外框.元器件封装: 2.借助软件使用,对产品结构有更深入的体会. 学习过程: 1.由于本人急需在短时间内具备简单的二维绘图能力,故没有借鉴.对比网络上其他 ...
- Hacker communities collection
Copy from E安全 Hack Forums: Hack Forums是目前最为理想的黑客技术学习根据地.该论坛不仅在设计上面向黑客群体,同时也适用于开发人员.博主.游戏开发者.程序员.图形设计 ...
- Java的cmd配置（也即Java的JDK配置及相关常用命令）——找不到或无法加载主类 的解决方法
Java的cmd配置(也即Java的JDK配置及相关常用命令) ——找不到或无法加载主类 的解决方法 这段时间一直纠结于cmd下Java无法编译运行的问题.主要问题描述如下: javac 命令可以正 ...
- AC日记——输出亲朋字符串 openjudge 1.7 05
05:输出亲朋字符串 总时间限制: 1000ms 内存限制: 65536kB 描述 编写程序,求给定字符串s的亲朋字符串s1. 亲朋字符串s1定义如下:给定字符串s的第一个字符的ASCII值加第二 ...
- sql执行效率,explain 查询执行效率
1.对查询进行优化,应尽量避免全表扫描,首先应考虑在 where 及 order by 涉及的列上建立索引. 2.应尽量避免在 where 子句中对字段进行 null 值判断,否则将导致引擎放弃使用索 ...
- [No000009]学习重要还是经营人脉重要？
大说数人的朋友圈都是这样的:雪中送炭的寥寥无几,锦上添花的大多数人连你自己都不认识,碰到倒霉的时候还能遇到落进下石的.人脉是很重要,可相对自身的学习来说,就没有想象中那么重要了. 有一次在北大讲座,遇 ...
- java 22 - 10 多线程之两种代码实现方式的比较与区别
- 转: rapidJSON与jsoncpp语法说明
转: http://www.voidcn.com/blog/hudejun007/article/p-1811986.html
- JSOI Round 2题解
强行一波题解骗一个访问量好了... http://blog.csdn.net/yanqval/article/details/51457302 http://absi2011.is-programme ...