📅  最后修改于: 2020-12-16 05:03:17        🧑  作者: Mango

Angular 7架构Angular 7是一个平台和框架，用于以HTML和TypeScript创建客户端应用程序。 Angular 7用TypeScript编写。Angular 7将核心和可选功能实现为一组TypeScript库，您可以在应用程序中将其导入。NgModules是Angular 7应用程序的基本构建块。它们为组件提供了编译上下文。 Angular 7应用程序由一组NgModule定义...

📅  最后修改于: 2020-12-16 05:04:15        🧑  作者: Mango

Angular 7组件组件是Angular的主要功能。整个应用程序是使用不同的组件构建的。Angular的核心思想是构建组件。它们使您的复杂应用程序成为可重用的部分，您可以非常轻松地重用它们。如何创建一个新的组件?打开WebStorm >>转到项目源文件夹>>展开应用程序目录并创建一个名为“ server”的新目录。现在，在服务器目录中创建组件。右键单击服务器目录，然后创建一个名为“ server...

📅  最后修改于: 2020-12-16 05:06:24        🧑  作者: Mango

Angular 7指令指令是DOM中的指令。它们指定如何在Angular中放置组件和业务逻辑。指令是js类，并声明为@directive。 Angular中有3个指令。组件指令结构指令属性指令组件指令：组件指令在主类中使用。它们包含有关如何在运行时处理，实例化和使用组件的详细信息。结构指令：结构指令以*符号开头。这些指令用于操纵和更改DOM元素的结构。例如，* ngIf和* ngFor。属性指令：...

📅  最后修改于: 2020-12-16 05:07:21        🧑  作者: Mango

使用* ngIf指令有条件地更改输出例：component.ts文件：component.html文件：输出：输出将如下所示。当我们更改输入值并单击“添加服务器”按钮时，您将看到以下结果：您可以在上面的示例中看到，通过使用* ngIf指令，我们可以更改条件以相应地显示输出。您可以在添加服务器之前和之后检查输出的视图源。您会清楚地看到差异。在添加服务器之前：添加服务器后：因此，您可以看到结构化指令如...

📅  最后修改于: 2020-12-16 05:08:19        🧑  作者: Mango

使用ngStyle动态设置样式元素ngStyle属性用于更改或设置Angular的多个属性的样式。您可以更改元素的值，颜色和大小等。让我们来看一个例子：component.ts文件：component.html文件：在这里，我们选择了一种方法来随机显示该方法“在线”和“离线”。有50％的机会。输出：让我们使用ngStyle在服务器离线时更改背景颜色“红色”，在服务器在线时更改“绿色”。compon...

📅  最后修改于: 2020-12-16 05:09:13        🧑  作者: Mango

角度数据绑定数据绑定是Angular的强大功能。 Angular数据绑定用于通信。它用于在TypeScript代码(您的业务逻辑)和显示给用户的其他组件(即HTML布局)之间进行通信。数据绑定是必要的，因为当我们使用TypeScript编写代码时，它将被编译为JavaScript，并且结果将显示在HTML布局上。因此，为了向用户显示正确和自发的结果，必须进行适当的通信。这就是为什么在Angular...

📅  最后修改于: 2020-12-16 05:10:11        🧑  作者: Mango

Angular 7字符串插值在Angular中，字符串插值用于在HTML模板上显示动态数据(在用户端)。它使您可以对component.ts文件进行更改，并从那里获取数据到HTML模板(component.html文件)。例如：component.ts文件：在这里，我们使用一些值指定了serverID和serverStatus。让我们在“ component.html”文件中使用它。compone...

📅  最后修改于: 2020-12-16 05:11:08        🧑  作者: Mango

Angular 7事件绑定Angular方便我们将事件与方法绑定在一起。此过程称为事件绑定。事件绑定与括号()一起使用。让我们看一个例子：component.html文件：它将显示“未创建服务器”的输出。现在，我们将使用按钮绑定事件。在component.ts文件中添加另一个方法onCreateServer()，它将调用该事件。component.html文件：输出：现在，单击按钮后，您将看到它显...

📅  最后修改于: 2020-12-16 05:12:08        🧑  作者: Mango

Angular 7属性绑定在Angular 7中，属性绑定用于传递组件类(component.ts)中的数据，并在用户端(component.html)中设置给定元素的值。属性绑定是单向数据绑定的一个示例，其中数据从组件传输到类。属性绑定的主要优点是它可以帮助您控制元素的属性。例如我们将向“ component.html”页面添加一个按钮。component.ts文件：输出：让我们看看属性绑定是如...

📅  最后修改于: 2020-12-16 05:13:09        🧑  作者: Mango

角度7管道在Angular 1中，使用了过滤器，后来称为Pipes onwards Angular2。在Angular 7中，它称为管道，用于转换数据。用符号|表示。句法：管道将整数，字符串，数组和日期作为输入，并用|分隔。它按照所需的格式转换数据，并在浏览器中显示该数据。让我们来看一个使用管道的示例。在这里，我们使用管道以大写和小写形式显示标题文本。例：在component.ts文件中定义一个名...

📅  最后修改于: 2020-12-16 09:56:41        🧑  作者: Mango

角度误差修复由于多种原因，您可能会在Angular中出现错误。让我们以一个示例来看一些特定类型的错误。我们创建了一个名为“ testing-app”的应用。在这个应用程序中，我们在页面上有一个服务器和一个按钮，可以创建其他服务器。在这里，“component.html”文件包含以下代码：component.ts文件：查看输出：现在，如果单击“添加服务器”按钮，它将不会添加任何服务器。打开浏览器控制...

📅  最后修改于: 2020-12-16 09:57:35        🧑  作者: Mango

角度7形式角形用于处理用户的输入。我们可以在应用程序中使用Angular表单，使用户能够登录，更新配置文件，输入信息以及执行许多其他数据输入任务。在Angular 7中，有两种方法可以通过表单来处理用户的输入：反应形式模板驱动的表格两种方法都用于从视图中收集用户输入事件，验证用户输入，创建要更新的表单模型和数据模型以及提供跟踪更改的方法。反应性表单与模板驱动的表单响应式表单和模板驱动的表单都以不同...

📅  最后修改于: 2020-12-16 09:58:28        🧑  作者: Mango

角度形式的数据流创建Angular表单时，了解框架如何处理数据流非常重要。 Angular中有两种形式的表单，即反应式表单和模板驱动形式，并且都遵循不同的结构来处理用户的输入。反应形式的数据流在Reactive表单中，视图中的每个表单元素都直接链接到表单模型(FormControl实例)。从视图到模型以及从模型到视图的任何更新都是同步的，并且不依赖于UI。让我们使用图表来了解它。当我们从视图然后从...

📅  最后修改于: 2020-12-16 09:59:21        🧑  作者: Mango

角反应形式角反应形式遵循模型驱动的方法来处理形式输入，其值可以随时间变化。这些也称为模型驱动形式。在反应式表单中，您可以创建和更新简单的表单控件，在组中使用多个控件，验证表单值以及实现更高级的表单。响应式表单使用显式且不变的方法来管理给定时间点的表单状态。当我们更改表单状态时，它将返回一个新状态，该状态管理更改之间的模型完整性。在反应形式中，您可以在组件类中构建自己的形式表示形式。反应形式易于测试...

📅  最后修改于: 2020-12-16 10:00:20        🧑  作者: Mango

模板驱动的表格模板驱动的表单可用于许多应用程序，即登录，提交请求，下订单，输入数据等。现在，让我们创建表单。按着这些次序：建立专案首先，使用以下命令创建一个名为angular-forms的新项目：现在，使用以下命令转到项目文件夹。现在，使用Angular CLI命令ng generate class Hero生成一个名为Hero的新类：转到您的项目文件夹angular-forms，然后在app模块...