标签:

开发教程

上一章我们简单地把 TodoMVC 的组件进行了拆分。 TodoMVC 很明显是一个以数据为中心的应用:整个系统围绕着待办列表,界面上几乎所有操作都是针对待办列表进行一系列操作。因此,我们可以使用数组保存这个待办列表,将页面显示绑定到列表中的数据,通过修改数据实现页面显示的修改。这个数组应该是全局可用的,方便我们对其进行管理。虽然 JavaScript 提供了全局变量供我们使用,但本着能不用就不用 ...

0 个评论 1.5K 次阅读

前面我们已经简单学习过 Angular 的一些核心内容,下面我们将完成一个演示项目,来看看在实际工程中,这些内容如何有机的整合在一起。 我们选择的是 TodoMVC。TodoMVC 是一个开源 JavaScript 项目框架。不同于一个项目或者一个开发库,TodoMVC 提供了一个应用程序的标准范本需求,要求使用各种不同的 MV* 框架实现这么一个 Todo 应用。 TodoMVC 是一个开源 J ...

0 个评论 1.6K 次阅读

前面我们已经介绍过组件。我们说过,组件是 Angular 的核心概念之一。Angular 的一切都是围绕着组件构建的。Angular 将组件定义为一种展示手段:用户看到的就是组件。但是,对于一个完整的应用,仅有展示显然是不够的:我们还有一系列业务逻辑和与之相匹配的数据。Angular 建议,组件应该只是对数据的展示,不应该持有数据。数据和业务逻辑应该交给服务。 所谓服务 service,是一个典型 ...

0 个评论 1.6K 次阅读

前面我们已经说过,Angular 的指令分为组件指令、结构指令和属性指令。我们已经详细介绍过 Angular 为我们内置的三种结构指令:ngIf、ngFor以及ngSwitch。但是,现实世界千变万化,区区几种内置指令不可能满足所有的需求。所以,Angular 也提供了自定义指令的方法。本章我们将介绍如何自定义指令。 自定义属性指令 虽然 Angular 提供了ngClass指令,将 CSS cl ...

1 个评论 1.7K 次阅读

前面我们介绍了ngIf和ngFor,作为某种一一对应的关系,今天我们将介绍另外一个结构指令:ngSwitch。ngSwitch完全可以使用ngIf替代,只不过在某一条件具有多种情形的时候,ngSwitch会更加方便使用。ngSwitch允许根据定义好的条件显示一个或多个 DOM 元素。 ngSwitch实际包含了三个指令,下面展示了ngSwitch的基本语法: ngSwitch作用于contain ...

0 个评论 1.6K 次阅读

上一章我们介绍了ngIf,这是一个条件选择的指令。与此类似,Angular 还提供了用于循环的指令:ngFor。ngFor指令遍历一个数据集合,;例如数组、列表等,然后在 HTML 模板中为每一个数据项创建一个 HTML 元素。这个指令可以帮助我们以一种优雅的方式,构建一个列表或表格。本章,我们将详细介绍ngFor指令。 ngFor语法 ngFor语法如下: 其中,<html-element ...

0 个评论 1.6K 次阅读

Angular 的指令用于维护 DOM 结构。使用指令,你可以改变 DOM 元素的样式、行为或者布局。Angular 提供了三种指令: 组件指令 结构指令 属性指令 我们前面介绍过的组件,就是一种特殊的指令。如果你去阅读 Angular 的源代码,在 packages/core/src/metadata/directives.ts 中有这么一段足以说明问题: 结构指令用于改变 DOM 结构,比如增 ...

0 个评论 1.6K 次阅读

前面的章节我们详细介绍了很多数据绑定,这些数据绑定的方法都是单向数据绑定。除了前面介绍的那些,Angular 还提供了双向数据绑定。 双向数据绑定 双向数据绑定意味着数据是双向流动的:既可以从组件流向视图,又可以从视图流向组件。当我们在组件中修改了数据时,修改后的数据会自动显示在视图;当用户在视图修改了数据时,修改后的数据会自动同步到组件。这一技术对于页面表单尤其有用。 不过仔细回想一下,双向数据 ...

0 个评论 1.5K 次阅读

前面我们已经使用三个章节介绍了从组件到视图的单向数据绑定,本章我们将介绍从视图到组件的单项数据绑定。 从视图到组件 从视图到组件的数据改变,通常是由用户直接或间接触发的,比如用户的键盘输入、鼠标点击等动作,因此这类数据绑定实际就是事件绑定。 事件绑定 Angular 事件绑定使用如下语法: target-event使用()包围,是事件的名字;TemplateStatement是模板语句。当targ ...

0 个评论 1.6K 次阅读

之前反复强调过,Angular 属性绑定使用 property。除此之外,Angular 也提供了几种特殊的绑定:class 和 style 的绑定以及 attribute 绑定。 绑定到 class 和 style 很特殊,是因为它们通常包含 CSS 类列表和其它的样式。这种绑定必须非常灵活,以满足页面的各种样式需要。普通的属性绑定覆盖了全部的 property,但不包括 HTML attrib ...

0 个评论 1.5K 次阅读
  • 1
  • 2

关于我

devbean

devbean

豆子,生于山东,定居南京。毕业于山东大学软件工程专业。软件工程师,主要关注于 Qt、Angular 等界面技术。

主题 Salodad 由 PenciDesign 提供 | 静态文件存储由又拍云存储提供 | 苏ICP备13027999号-2