[angularjs]hello world

转载 2013年12月01日 20:54:26
<!doctype html>
<html ng-app>
  <head>
    <script src="../angular.min.js"></script>
    <script>
		function TodoCtrl($scope) {                               
		  $scope.todos = [                                        
		    {text:'learn angular', done:true},                    
		    {text:'build an angular app', done:false}];           
		                                                          
		  $scope.addTodo = function() {                           
		    $scope.todos.push({text:$scope.todoText, done:false});
		    $scope.todoText = '';                                 
		  };                                                      
		                                                         
		  $scope.remaining = function() {                        
		    var count = 0;                                       
		    angular.forEach($scope.todos, function(todo) {       
		      count += todo.done ? 0 : 1;                        
		    });                                                  
		    return count;                                        
		  };                                                     
		                                                         
		  $scope.archive = function() {                          
		    var oldTodos = $scope.todos;                         
		    $scope.todos = [];                                   
		    angular.forEach(oldTodos, function(todo) {           
		      if (!todo.done) $scope.todos.push(todo);           
		    });                                                  
		  };                                                     
		}     	
    </script>
    <style>
		.done-true {
		  text-decoration: line-through;
		  color: grey;
		}
    </style>
  </head>
  <body>
    <h2>Todo</h2>
    <div ng-controller="TodoCtrl">
      <span>{{remaining()}} of {{todos.length}} remaining</span>
      [ <a href="" ng-click="archive()">archive</a> ]
      <ul class="unstyled">
        <li ng-repeat="todo in todos">
          <input type="checkbox" ng-model="todo.done">
          <span class="done-{{todo.done}}">{{todo.text}}</span>
        </li>
      </ul>
      <form ng-submit="addTodo()">
        <input type="text" ng-model="todoText"  size="30"
               placeholder="add new todo here">
        <input class="btn-primary" type="submit" value="add">
      </form>
    </div>
  </body>
</html>

(一)AngularJS入门贴之Hello World

以前项目都是使用JQuery和原始的javascript,最近参加一个项目需要用到AngularJS、RequireJS等比较潮的框架。这里写一些博客,记录自己的学习过程,虽然冠以原创之名,其实都是参...

【Arduino入门教程之一】入门Hello World

Arduino是目前较为流行的电子互动平台,基于单片机系统开发,具有使用简单、功能多样、价格低廉等优点,广泛应用于电子系统设计和互动产品开发方面。 Arduino 的开源、开放、廉价、简单、跨平台等特...

springBoot-Test (一) Hello world

  • 2017年11月24日 11:29
  • 14KB
  • 下载

Hello World · GitHub Guides.pdf

  • 2016年11月15日 20:38
  • 911KB
  • 下载

PyQt5 IDE安装并执行第一个hello world程序

PyQt5 IDE Eric 安装 配置

springMVC+spring+dubbo hello world测试项目

  • 2017年06月19日 15:32
  • 11.22MB
  • 下载

hello world!

  • 2015年10月15日 00:40
  • 124KB
  • 下载
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:[angularjs]hello world
举报原因:
原因补充:

(最多只允许输入30个字)