NET开发人员的Angular数据绑定

白癜风治疗的费用 http://m.39.net/baidianfeng/a_4525518.html

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

数据绑定

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

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

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

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

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

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

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

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

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

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

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

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

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

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

让我们逐一看一下。

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

双向数据绑定

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

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

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




转载请注明:http://www.aierlanlan.com/cyrz/4370.html

  • 上一篇文章:
  •   
  • 下一篇文章: