AngularJS 入门教程

作者： James Hartman James Hartman
小时 - 权威教程 更新于

AngularJS 教程摘要

这是一个为初学者准备的 AngularJS 教程，一步一步指导您从零开始学习 AngularJS。这个 Angular JS 教程指南将帮助您学习 AngularJS 的基础知识和组件，如指令、过滤器、表达式等，并探索其更多关于单页面应用（SPA）的编程方面。

什么是 AngularJS？

AngularJS 是一个用于构建基于 MVC 的 Web 应用程序的 JavaScript 框架。它允许您分离业务逻辑层、数据层和表示层。它使用 HTML 作为模板语言，通过扩展其语法来创建各种应用程序组件。它还通过数据绑定和依赖注入功能帮助减少代码量。

AngularJS 课程大纲

AngularJS 初学者基础

👉 第 1 课 什么是 AngularJS？ — 简介、架构与特性
👉 第 2 课 AngularJS Hello World — 您的第一个 AngularJS 程序
👉 第 3 课 AngularJS 控制器教程 — 是什么，如何通过示例构建

AngularJS 作用域、模型、视图

👉 第 1 课 Angular 作用域 — 什么是 AngularJS 中的 $Scope？带示例的教程
👉 第 2 课 ngRepeat — AngularJS ng-repeat 指令示例
👉 第 3 课 ngModel — 如何在 AngularJS 中使用 “ng-model” 并附带示例
👉 第 4 课 ngView — AngularJS ng-view 示例

AngularJS 表达式

👉 第 1 课 AngularJS 表达式 — 数组、对象、$eval、字符串 [示例]
👉 第 2 课 AngularJS 过滤器示例 — 小写、大写和 JSON
👉 第 3 课 AngularJS 自定义过滤器 — 如何在 AngularJS 中创建自定义过滤器并附带示例
👉 第 4 课 AngularJS 指令示例 — ng-init, ng-repeat, ng-app, ng-model
👉 第 5 课 AngularJS 中的自定义指令 — 如何创建自定义指令？[示例]

AngularJS 基础知识步步学

👉 第 1 课 AngularJS 模块 — AngularJS 模块教程与示例
👉 第 2 课 AngularJS 事件 — ng-click, ng-show, ng-hide 指令 [示例]
👉 第 3 课 带参数的 AngularJS 路由 — 单页面应用示例
👉 第 4 课 AngularJS $resource 和 $http — 使用 $resource, $http 进行 AngularJS AJAX 调用 [示例]
👉 第 5 课 AngularJS 表格 — 排序、OrderBy 和大写过滤器 [示例]
👉 第 6 课 AngularJS 提交时表单验证 — 表单示例
👉 第 7 课 AngularJS 表单提交示例 — 如何使用 ng-submit 提交表单
👉 第 8 课 AngularJS 中的 ng-include — 如何包含 HTML 文件 [示例]
👉 第 9 课 AngularJS 依赖注入 — 注入了哪些组件

相关文章

AngularJS 进阶内容！

👉 第 1 课 AngularJS 单元测试 — Karma Jasmine 教程
👉 第 2 课 Protractor 测试教程 — 自动化工具框架
👉 第 3 课 AngularJS vs Angular 2 vs Angular 4 — 有什么区别？
👉 第 4 课 React vs Angular — 您必须知道的10个最重要区别！

AngularJS 面试问题、书籍和教程 PDF

👉 第 1 课 AngularJS 面试问题 — 75个最热门的 AngularJS 面试问题与答案
👉 第 2 课 AngularJS 书籍 — 10本最适合初学者和专家的 AngularJS 书籍
👉 第 3 课 AngularJS 教程 PDF — 下载为初学者准备的 AngularJS 教程 PDF

在这个 Angular JS 教程中您将学到什么？

在这个为初学者准备的 AngularJS 教程中，您将学习 Angular JS 的基础知识，如什么是 AngularJS、控制器、作用域、ng-model、ng-view、AngularJS 表达式、模块、事件、表格、表单等，以及高级概念，如 AngularJS 单元测试、Protractor 测试、AngularJS 版本、AngularJS 面试问题等。

为什么要学习 AngularJS？

AngularJS 是一个开源框架，广泛用于创建客户端 MVC Web 应用程序。此外，它被全球各行各业的个人和企业广泛使用，因此对于具备良好 Angular JS 知识的求职者来说，有巨大的职业机会。

学习 AngularJS 的先决条件

这个 Angular 教程是为初学者设计的。但是，如果您具备 HTML、CSS 和 JavaScript 的基础知识，将会更有帮助。

AngularJS 的特点

以下是 Angular JS 的主要特点：

  • 它是一个开源的 JavaScript MVW 框架
  • 通过添加标签、属性和表达式来扩展 HTML 支持
  • 允许轻松处理事件
  • 提供数据绑定支持
  • 提供内置的模板引擎和路由
  • 提供表单验证和动画
  • 提供依赖注入

简单的 AngularJS 程序示例

<!DOCTYPE html>
<html>
<script src="https://code.angularjs.org/1.6.9/angular.js"></script>
<head>
    <meta chrset="UTF 8">
    <title>Basic AngularJS Program</title>
</head>
<body ng-app="">

<h3>This is AngularJS Tutorial for Beginners..!!</h3>

</body>
</html>

输出

This is AngularJS Tutorial for Beginners..!!