加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 综合聚焦 > 服务器 > 安全 > 正文

AngularJS学习笔记

发布时间:2020-12-17 10:30:53 所属栏目:安全 来源:网络整理
导读:AngularJS 学习笔记 AngularJS是一个JavaScript 框架。它可通过 script 标签添加到 HTML 页面。 AngularJS通过指令扩展了HTML,且通过表达式绑定数据到HTML。 在数据变化或是表单变化时,能够实时同步。 $scope (相当于作用域、控制范围)用来保存AngularJS

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 元素。

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

< div ng-app= "myApp" ng-controller= "personCtrl" >
< p >姓名为 {{ lastName | uppercase }} < /p >
< /div >
< div ng-app= "myApp" ng-controller= "costCtrl" >
< input type= "number" ng-model= "quantity" >
< input type= "number" ng-model= "price" >
< p >总价 = {{ (quantity * price) | currency }} < /p >
< /div >
< div ng-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 点击事件。

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读