AngularJS学习第一篇 AngularJS基础知识

前端之家收集整理的这篇文章主要介绍了AngularJS学习第一篇 AngularJS基础知识前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

AngularJS学习第一篇,了解指令、过滤器等相关内容

指令

AngularJS 指令是扩展的 HTML 属性,带有前缀 ng-

1、 ng-app:

定义了 AngularJS 应用程序的根元素; ng-app 指令在网页加载完毕时会自动引导(自动初始化)应用程序;

2、 ng-init:

为 AngularJS 应用程序定义了 初始值; 通常情况下,我们使用一个控制器或模块来代替它;

我的名字是:{{ firstName }}

3、 ng-model:

绑定 HTML 元素 到应用程序数据 同时也可以: 为应用程序数据提供类型验证(number、email、required); 为应用程序数据提供状态(invalid、dirty、touched、error); 为HTML 元素提供 CSS 类; 绑定 HTML 元素到 HTML 表单;

姓名:

我的名字是:{{ firstName }}

4、ng-repeat:对于集合中(数组中)的每个项会 克隆一次 HTML 元素。

  • 5、ng-controller:为应用程序添加控制器。请根据下面示例进行了解:

    姓: 姓名: {{fullName()}}

    6、ng-options:创建一个下拉列表,列表项通过对象和数组循环输出

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

    Box" ng-model="mySwitch"/>按钮 {{ mySwitch }}

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

    9、ng-click:指令定义了一个 AngularJS 单击事件。

    {{ count }}

    10、ng-include:使用 ng-include 指令来包含 HTML 内容

    过滤器

    使用一个管道字符(|)添加到表达式和指令中 常见表达式: currency:格式化数字为货币格式; filter:从数组项中选择一个子集; lowercase:格式化字符串为小写; orderBy:根据某个表达式排列数组; uppercase:格式化字符串为大写;

    姓名为 {{ lastName | uppercase }}

  • 服务

    在 AngularJS 中,服务是一个函数或对象,可在你的 AngularJS 应用中使用; AngularJS 中你可以创建自己的服务,或使用内建服务; AngularJS 内建了30 多个服务; 自定义服务

    常用内置服务

    1、$http:是 AngularJS 中的一个核心服务。服务向服务器发送请求,应用响应服务器传送过来的数据;

    2、$location:服务对应了 window.location 函数

    3、$timeout:服务对应了 window.setTimeout 函数

    4、$interval:服务对应了 window.setInterval 函数

    5、$rootScope:它可以作用在 ng-app 指令包含的所有 HTML 元素中。用 rootscope 定义的值,可以在各个 controller 中使用。

    以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持编程之家。

    原文链接:https://www.f2er.com/js/41773.html
    基础知识

    猜你在找的JavaScript相关文章