在本文中，我们将学习Angular中的数据绑定。幸运的是，Angular中的数据绑定比.NET简单得多。

数据绑定

在我的工作中，我有机会与许多想要学习Angular的.NET开发人员交流。通常，我已经看到他们带来了他们的.NET技能并努力帮助他们学习Angular。虽然努力和学习的驱动力在那里，但Angular并不是.NET。

由于Angular是一个纯JavaScript框架，因此我将在本系列中简化Angular for .NET开发人员的基本但重要的概念。

在本文中，我们将学习Angular中的数据绑定。幸运的是，Angular中的数据绑定比.NET简单得多。

首先，让我们修改.NET中的一些数据绑定技术。例如，在ASP.NET MVC中，您使用模型进行数据绑定。视图受到约束：

到一个对象。一个复杂的对象。到一组对象。

实质上，在ASP.NET MVC中，您将数据绑定到模型类。另一方面，在WPF中，您可以使用数据绑定模式。您可以在XAML中设置数据绑定的模式，如下所示：

单向数据绑定。双向数据绑定。一次性数据绑定。单向源数据绑定。

如果您遵循MVVM模式，那么您可能正在使用INotifyPropertyChanged接口来实现双向数据绑定。因此，在.NET世界中有很多方法可以实现数据绑定。

然而，Angular中的数据绑定要简单得多。

如果您对Angular非常陌生，那么让我向您介绍组件。在Angular应用程序中，您在浏览器（或其他地方）中看到的是一个组件。组件由以下部分组成：

TypeScript类，称为组件 类。一个称为组件模板的HTML文件。用于组件样式的可选CSS文件。

在Angular中，数据绑定决定了数据 在组件类和组件模板之间的流动方式。

Angular为我们提供了三种类型的数据绑定。它们如下：

插值。财产约束。事件绑定。

让我们逐一看一下。

Angular为您提供这三种绑定。在事件绑定中，数据从模板流向类，并且在属性绑定和插值中，数据从类流向模板。

双向数据绑定

Angular没有内置的双向数据绑定，但是，通过组合属性绑定和事件绑定，可以实现双向数据绑定。

Angular为我们提供了一个指令， ngModel实现双向数据绑定，并且它非常易于使用。

作为.NET开发人员，您可能已经意识到Angular中的数据绑定要简单得多，您需要知道的只有四种语法。我希望你发现这篇文章很有用，在后面的文章中，我们将介绍其他Angular主题。