AngularJS学习笔记（1）

来源：互联网发布：c语言continue和break 编辑：程序博客网时间：2024/05/18 01:09

1. 简介：

参考：http://www.runoob.com/angularjs/angularjs-intro.html

AngularJS 是一个 JavaScript 框架。它是一个以 JavaScript 编写的库。

AngularJS 通过 ng-directives 扩展了 HTML。

ng-app 指令定义一个 AngularJS 应用程序。

ng-model 指令把元素值（比如输入域的值）绑定到应用程序。

ng-bind 指令把应用程序数据绑定到 HTML 视图。

实例：

<!DOCTYPE html><html><head lang="en" >    <meta charset="UTF-8">    <title></title>    <link href="css/bootstrap.min.css" type="text/css" rel="stylesheet"></head><!--声明管理边界--><body style="padding:10px;" ng-app="todoList" ng-controller="TaskCtrl">    <div class="input-group">        <input ng-model="task" type="text" class="form-control">        <span class="input-group-btn">            <button class="btn btn-default" ng-click="add()">提交</button>        </span>    </div>    <h4 ng-hide="tasks.length==0">任务列表</h4>    <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)">删除</a>        </li>    </ul></body><script src="js/angular.min.js"></script><script type="text/javascript">    var app = angular.module('todoList',[]);    app.controller('TaskCtrl', function($scope) {        $scope.task="";        $scope.tasks=[];        $scope.add = function () {            $scope.tasks.push($scope.task)        }    });</script></html>

0 0