您的位置:首页 > Web前端 > AngularJS

AngularJS学习笔记

2016-10-13 09:37 274 查看

AngularJS学习笔记

AngularJS是一个JavaScript 框架。它可通过 <script> 标签添加到 HTML 页面。

AngularJS通过指令扩展了HTML,且通过表达式绑定数据到HTML。

在数据变化或是表单变化时,能够实时同步。

$scope (相当于作用域、控制范围)用来保存AngularJS Model(模型)的对象。

服务是一个函数或对象,可在你的 AngularJS 应用中使用。

1.指令:

AngularJS 通过 ng-directives 扩展了 HTML。

ng-include 指令包含 HTML 内容。

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

ng-controller用于定义一个控制器。

ng-init 指令初始化应用程序数据。

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

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

ng-repeat 指令会重复一个 HTML 元素。

ng-disabled 指令直接绑定应用程序数据到 HTML 的 disabled 属性。

ng-show 指令隐藏或显示一个 HTML 元素。

ng-hide 指令用于隐藏或显示 HTML 元素。

过滤器使用一个管道字符(|)添加到表达式和指令中。

<divng-app="myApp"
ng-controller="personCtrl">

   <p>姓名为{{ lastName | uppercase }}</p>
</div>
<divng-app="myApp"
ng-controller="costCtrl">

   <input
type="number" ng-model="quantity">

   <input
type="number" ng-model="price">

   <p>总价 ={{ (quantity * price) | currency }}</p>
</div>
<divng-app="myApp"
ng-controller="namesCtrl">
<ul>

  <li
ng-repeat="x in names | orderBy:'country'">

    {{ x.name + ', ' + x.country }}

  </li>
</ul>
<div>

2.事件ng-click 指令定义了 AngularJS 点击事件。

 

 

 
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息