Angular 模板-介紹

2022-06-29 15:16 更新

模板語法

在 Angular 中,模板就是一塊 HTML。你可以在模板中通過一種特殊的語法來使用 Angular 的諸多特性。

先決條件

在學(xué)習(xí)模板語法之前,你應(yīng)該熟悉下列內(nèi)容:

  • Angular 的概念
  • JavaScript
  • HTML
  • CSS

應(yīng)用程序中的每個(gè) Angular 模板都是一塊 HTML,你可以將其包含在瀏覽器顯示的頁面中。 Angular 中的 HTML 模板與常規(guī) HTML 一樣,可以在瀏覽器中渲染視圖或用戶界面,但功能要多得多。

使用 Angular CLI 生成 Angular 應(yīng)用時(shí), ?app.component.html? 文件是一個(gè)包含占位符 HTML 的默認(rèn)模板。

本模板語法指南向你展示了如何通過協(xié)調(diào)類和模板之間的數(shù)據(jù)來控制 UX/UI。

大多數(shù)模板語法指南都有專門的可工作的范例應(yīng)用,這些應(yīng)用程序演示了每個(gè)指南中的各個(gè)主題。要查看把所有應(yīng)用合在一起時(shí)的工作情況,請(qǐng)參閱綜合Template Syntax Live Code / 下載范例。

為你的 HTML 賦能

在模板中使用 Angular 的特有語法來擴(kuò)展應(yīng)用程序的 HTML 詞匯表。例如,Angular 可以通過內(nèi)置的模板函數(shù)、變量、事件監(jiān)聽和數(shù)據(jù)綁定等功能來幫助你動(dòng)態(tài)獲取和設(shè)置 DOM(文檔對(duì)象模型)中的值。

幾乎所有的 HTML 語法都是有效的模板語法。但是,由于 Angular 模板只是整個(gè)網(wǎng)頁的一部分,而不是整個(gè)網(wǎng)頁,因此你不需要包含諸如 ?<html>? , ?<body>? 或 ?<base>? 元素。這樣你可以專注于正在開發(fā)的那部分頁面。

為了消除腳本注入攻擊的風(fēng)險(xiǎn),Angular 不支持模板中使用 ?<script>? 元素。Angular 會(huì)忽略 ?<script>? 標(biāo)記,并向?yàn)g覽器控制臺(tái)輸出一條警告。


以上內(nèi)容是否對(duì)您有幫助:
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號(hào)
微信公眾號(hào)

編程獅公眾號(hào)