本篇文章給大家分享50個(gè)必須掌握的Angular面試題，會(huì)從初學(xué)者-中級-高級三個(gè)部分來解析這50個(gè)面試題，帶大家吃透它們翅帜！

image

我們整理了一份主要的Angular面試問題清單荣德，分為三部分：

• 角度面試問題–初學(xué)者水平
• 角度面試問題–中級
• 角度面試問題–高級

【相關(guān)教程推薦：《angular教程》】

初學(xué)者水平–面試問題

1.區(qū)分Angular和AngularJS闷煤。

2.什么是Angular？

Angular是一個(gè)開放源代碼的前端Web框架署咽。它是最流行的JavaScript框架之一近顷，主要由Google維護(hù)。它提供了一個(gè)輕松開發(fā)基于Web的應(yīng)用程序的平臺(tái)宁否，并使前端開發(fā)人員能夠管理跨平臺(tái)應(yīng)用程序窒升。它集成了強(qiáng)大的功能，例如聲明性模板慕匠，端到端工具饱须，依賴項(xiàng)注入以及各種其他使開發(fā)路徑更流暢的最佳實(shí)踐。

3.使用Angular有什么優(yōu)勢台谊？

下面列出了使用Angular框架的一些主要優(yōu)點(diǎn)：

• 支持雙向數(shù)據(jù)綁定
• 它遵循MVC模式架構(gòu)
• 它支持靜態(tài)模板和Angular模板
• 您可以添加自定義指令
• 它還支持RESTfull服務(wù)
• 支持驗(yàn)證
• 客戶端和服務(wù)器之間的通訊便利
• 支持依賴注入
• 具有強(qiáng)大的功能蓉媳，例如事件處理程序，動(dòng)畫等锅铅。

4. Angular主要用于什么酪呻？

Angular通常用于表示單頁應(yīng)用程序的SPA的開發(fā)。Angular提供了一組現(xiàn)成的模塊盐须，可簡化單頁應(yīng)用程序的開發(fā)号杠。不僅如此，Angular還具有內(nèi)置數(shù)據(jù)流，類型安全性和模塊化CLI的功能姨蟋，被認(rèn)為是成熟的Web框架屉凯。

5.什么是角度表達(dá)式？

角表達(dá)式是類似于JavaScript的代碼段眼溶，通常放在諸如{{expression}}之類的綁定中悠砚。這些表達(dá)式用于將應(yīng)用程序數(shù)據(jù)綁定到HTML

語法：{{expression}}

6. Angular中的模板是什么？

Angular中的模板是使用包含特定于Angular的元素和屬性的HTML編寫的堂飞。這些模板與來自模型和控制器的信息結(jié)合在一起灌旧，進(jìn)一步渲染這些信息以向用戶提供動(dòng)態(tài)視圖。

7. 在Angular中绰筛，什么是字符串插值枢泰？

Angular中的字符串插值是一種特殊的語法，它在雙花括號 {{}}中使用模板表達(dá)式來顯示組件數(shù)據(jù)铝噩。它也稱為小胡子語法衡蚂。JavaScript表達(dá)式包含在花括號中，由Angular執(zhí)行骏庸，然后將相對輸出嵌入HTML代碼中毛甲。這些表達(dá)式通常像表一樣進(jìn)行更新和注冊，作為摘要循環(huán)的一部分具被。

8. Angular中的Annotation和Decorator有什么區(qū)別玻募？

使用Reflect Metadata庫，角度注釋是類的“唯一”元數(shù)據(jù)集一姿。它們用于創(chuàng)建“注釋”數(shù)組七咧。另一方面，裝飾器是用于分離裝飾或修改類的設(shè)計(jì)模式叮叹，而無需實(shí)際更改原始源代碼坑雅。

9.您對Angular中的控制器了解多少？

控制器是JavaScript函數(shù)衬横，可為HTML UI提供數(shù)據(jù)和邏輯裹粤。顧名思義，它們控制數(shù)據(jù)如何從服務(wù)器流到HTML UI蜂林。

10. Angular的范圍是什么遥诉？

Angular中的范圍是一個(gè)引用應(yīng)用程序模型的對象。它是表達(dá)式的執(zhí)行上下文噪叙。范圍以模仿應(yīng)用程序DOM結(jié)構(gòu)的層次結(jié)構(gòu)排列矮锈。范圍可以監(jiān)視表達(dá)式并傳播事件。

11. Angular中的指令是什么睁蕾？

Angular的核心功能是指令苞笨，這些屬性使您可以編寫 特定于應(yīng)用程序的新HTML語法债朵。它們本質(zhì)上是在Angular編譯器在DOM中找到它們時(shí)執(zhí)行的函數(shù)。Angular指令分為三部分：

• 組件指令

• 結(jié)構(gòu)指令

• 屬性指令

12.什么是數(shù)據(jù)綁定瀑凝？

在Angular中序芦，數(shù)據(jù)綁定是最強(qiáng)大，最重要的功能之一粤咪，可讓您定義組件與DOM（文檔對象模型）之間的通信谚中。它從根本上簡化了定義交互式應(yīng)用程序的過程，而不必?fù)?dān)心在視圖或模板與組件之間推送和提取數(shù)據(jù)寥枝。在Angular中宪塔，數(shù)據(jù)綁定有四種形式：

• 字符串插值

• 屬性綁定

• 事件綁定

• 雙向數(shù)據(jù)綁定

13.在Angular中使用過濾器的目的是什么？

Angular中的過濾器用于格式化表達(dá)式的值囊拜，以便將其顯示給用戶某筐。這些過濾器可以添加到模板，指令冠跷，控制器或服務(wù)中南誊。不僅如此，您還可以創(chuàng)建自己的自定義過濾器蔽莱。使用它們弟疆，您可以輕松地組織數(shù)據(jù)戚长，使數(shù)據(jù)僅在滿足特定條件時(shí)才顯示盗冷。通過使用豎線字符|，將過濾器添加到表達(dá)式中同廉，然后是過濾器仪糖。

14. Angular和jQuery有什么區(qū)別？

15. Angular中的提供程序是什么迫肖？

提供程序是Angular中的可配置服務(wù)锅劝。這是對依賴關(guān)系注入系統(tǒng)的一條指令，它提供有關(guān)獲取依賴關(guān)系值的方式的信息蟆湖。它是一個(gè)具有<math xmlns="http://www.w3.org/1998/Math/MathML"><semantics><annotation encoding="application/x-tex">get（）方法的對象故爵，該方法被調(diào)用以創(chuàng)建服務(wù)的新實(shí)例。提供者還可以包含其他方法隅津，并使用</annotation></semantics></math>get（）方法的對象诬垂，該方法被調(diào)用以創(chuàng)建服務(wù)的新實(shí)例。提供者還可以包含其他方法伦仍，并使用 provide來注冊新的提供者结窘。

中級–面試問題

16. Angular是否支持嵌套控制器？

是的充蓝，Angular確實(shí)支持嵌套控制器的概念隧枫。需要以層次方式定義嵌套控制器喉磁，以便在視圖中使用它。

17.如何區(qū)分Angular表達(dá)式和JavaScript表達(dá)式官脓？

18.列出使用核心Angular功能在應(yīng)用程序模塊之間進(jìn)行通信的方式簸州。

以下是使用核心Angular功能在應(yīng)用程序模塊之間進(jìn)行通信的最通用方法：

• 使用事件
• 使用服務(wù)
• 通過在$ rootScope上分配模型
• 直接在控制器之間[ $ parent， <math xmlns="http://www.w3.org/1998/Math/MathML"><semantics><annotation encoding="application/x-tex">childHead歧譬， </annotation></semantics></math>childHead??岸浑，?? nextSibling等]
• 直接在控制器之間[ ControllerAs或其他繼承形式]

19. service（）和factory（）有什么區(qū)別？

Angular中的service（）是用于應(yīng)用程序業(yè)務(wù)層的函數(shù)瑰步。它作為構(gòu)造函數(shù)運(yùn)行矢洲，并在運(yùn)行時(shí)使用'new'關(guān)鍵字調(diào)用一次。而factory（）是一個(gè)類似于service（）的函數(shù)缩焦，但功能更強(qiáng)大读虏，更靈活。factory（）是有助于創(chuàng)建對象的設(shè)計(jì)模式袁滥。

20. $ scope和Angular中的scope有什么區(qū)別盖桥？

• Angular中的$ scope用于實(shí)現(xiàn)依賴項(xiàng)注入（DI）的概念，另一方面题翻，scope 用于指令鏈接揩徊。
• <math xmlns="http://www.w3.org/1998/Math/MathML"><semantics><annotation encoding="application/x-tex">scope是</annotation></semantics></math>??scope??是 scopeProvider提供的服務(wù)，可以注入到控制器嵌赠，指令或其他服務(wù)中塑荒，而Scope可以是任何東西，例如函數(shù)參數(shù)名稱等猾普。

21.解釋范圍層次的概念嗎袜炕？

Angular中的<math xmlns="http://www.w3.org/1998/Math/MathML"><semantics><annotation encoding="application/x-tex">scope對象被組織成一個(gè)層次結(jié)構(gòu)，并且主要由視圖使用初家。它包含一個(gè)根范圍偎窘，該范圍可以進(jìn)一步包含稱為子范圍的范圍乌助。一個(gè)根作用域可以包含多個(gè)子作用域。在這里陌知，每個(gè)視圖都有自己的</annotation></semantics></math>scope對象被組織成一個(gè)層次結(jié)構(gòu)他托，并且主要由視圖使用。它包含一個(gè)根范圍仆葡，該范圍可以進(jìn)一步包含稱為子范圍的范圍赏参。一個(gè)根作用域可以包含多個(gè)子作用域。在這里沿盅，每個(gè)視圖都有自己的 scope把篓，因此由其視圖控制器設(shè)置的變量將對其他控制器隱藏。范圍層次結(jié)構(gòu)通常如下所示：

• 根$ scope

  • 控制器1的$ scope

  • 控制器2的$ scope

  • ..

  • 控制器'n'的$ scope

22.什么是AOT腰涧？

AOT代表Angular-Ahead-of-Time編譯器韧掩。它用于在構(gòu)建過程中預(yù)編譯應(yīng)用程序組件及其模板。用AOT編譯的Angular應(yīng)用程序的啟動(dòng)時(shí)間更短窖铡。同樣疗锐，這些應(yīng)用程序的組件可以立即執(zhí)行，而無需任何客戶端編譯费彼。這些應(yīng)用程序中的模板作為代碼嵌入其組件中滑臊。它減少了下載Angular編譯器的需要，從而使您免于繁瑣的任務(wù)箍铲。AOT編譯器可以丟棄未使用的指令雇卷，這些指令會(huì)使用搖樹工具進(jìn)一步丟棄。

23.解釋jQLite虹钮。

jQlite也稱為 jQuery lite是jQuery的子集聋庵，包含其所有功能膘融。默認(rèn)情況下芙粱，它打包在Angular中。它幫助Angular以兼容的跨瀏覽器方式操作DOM氧映。jQLite基本上僅實(shí)現(xiàn)最常用的功能春畔，因此占用空間小。

24.解釋Angular中的摘要循環(huán)過程岛都？

Angular中的摘要周期是監(jiān)視監(jiān)視列表的過程律姨，以跟蹤監(jiān)視變量的值的變化。在每個(gè)摘要循環(huán)中臼疫，Angular都會(huì)比較范圍模型值的先前版本和新版本择份。通常，此過程是隱式觸發(fā)的烫堤，但是您也可以使用$ apply（）手動(dòng)將其激活荣赶。

25.什么是Angular模塊凤价？

所有Angular應(yīng)用程序都是模塊化的，并遵循稱為NgModules的模塊化系統(tǒng)拔创。這些容器保存著專門用于應(yīng)用程序域利诺，工作流或一組緊密相關(guān)的功能的內(nèi)聚代碼塊。這些模塊通常包含組件剩燥，服務(wù)提供商和其他代碼文件慢逾，其范圍由包含的NgModule定義。有了模塊灭红，代碼變得更加可維護(hù)侣滩，可測試和易讀。同樣变擒，應(yīng)用程序的所有依賴關(guān)系通常僅在模塊中定義胜卤。

26.我們可以在哪種類型的組件上創(chuàng)建自定義指令？

Angular支持創(chuàng)建以下內(nèi)容的自定義指令：

• 元素指令 -當(dāng)遇到匹配的元素時(shí)赁项，指令將激活葛躏。
• 屬性 -當(dāng)遇到匹配的屬性時(shí)，指令將激活悠菜。
• CSS- 指令會(huì)在遇到匹配的CSS樣式時(shí)激活舰攒。
• 注釋 -遇到匹配的注釋時(shí)，指令將激活

27. Angular中有哪些不同類型的過濾器悔醋？

以下是Angular支持的各種過濾器：

• 貨幣： 將數(shù)字格式化為貨幣格式摩窃。
• 日期： 將日期格式化為指定的格式。
• filter： 從數(shù)組中選擇項(xiàng)的子集芬骄。
• json： 將對象格式化為JSON字符串猾愿。
• limit：將數(shù)組/字符串限制為指定數(shù)量的元素/字符。
• 小寫： 將字符串格式化為小寫账阻。
• number： 將數(shù)字格式化為字符串蒂秘。
• orderBy： 按表達(dá)式對數(shù)組排序。
• 大寫： 將字符串格式化為大寫淘太。

28.什么是Angular中的依賴注入姻僧？

依賴注入（DI）是一種軟件設(shè)計(jì)模式，其中對象作為依賴關(guān)系傳遞蒲牧，而不是在組件中對其進(jìn)行硬編碼撇贺。當(dāng)您嘗試將對象創(chuàng)建的邏輯與使用對象的邏輯分開時(shí)，依賴注入的概念會(huì)派上用場冰抢∷伤唬“ config”操作使用DI，在加載模塊以檢索應(yīng)用程序的元素時(shí)挎扰，必須預(yù)先配置DI翠订。使用此功能缓升，用戶可以根據(jù)自己的要求更改依賴關(guān)系。

29.區(qū)分單向綁定和雙向數(shù)據(jù)綁定蕴轨。

在 單向數(shù)據(jù)綁定中港谊，無論何時(shí)更改數(shù)據(jù)模型，“視圖”或“ UI”部分都不會(huì)自動(dòng)更新橙弱。您需要手動(dòng)編寫自定義代碼歧寺，以便在每次視圖更改時(shí)對其進(jìn)行更新。

而在雙向數(shù)據(jù)綁定中棘脐，一旦更改數(shù)據(jù)模型斜筐，則隱式更新View或UI部分。與單向數(shù)據(jù)綁定不同蛀缝，這是一個(gè)同步過程顷链。

30.組件和指令的生命周期掛鉤是什么？

Angular組件具有離散的生命周期屈梁，其中包含從出生到死亡過渡的不同階段嗤练。為了更好地控制這些階段，我們可以使用以下方法將其連接：

• 構(gòu)造函數(shù)： 通過在類上調(diào)用new創(chuàng)建組件或指令時(shí)將調(diào)用它在讶。
• ngOnChanges：每當(dāng)組件的任何輸入屬性發(fā)生更改或更新時(shí)煞抬，都將調(diào)用它。
• ngOnInit：每次初始化給定組件時(shí)都會(huì)調(diào)用它构哺。在第一個(gè)ngOnChanges之后革答，該掛鉤在其生命周期中僅被調(diào)用一次。
• ngDoCheck：每當(dāng)調(diào)用給定組件的更改檢測器時(shí)曙强，便會(huì)調(diào)用它残拐。這使您可以為提供的組件實(shí)現(xiàn)自己的變更檢測算法。
• ngOnDestroy： 在Angular銷毀組件之前立即調(diào)用它碟嘴。您可以使用此鉤子來取消訂閱可觀察對象并分離事件處理程序溪食，以避免發(fā)生任何類型的內(nèi)存泄漏。

31.通過對Angular進(jìn)行臟檢查臀防，您了解什么眠菇？

在Angular中边败，摘要過程稱為臟檢查袱衷。之所以調(diào)用它，是因?yàn)樗鼟呙枵麄€(gè)范圍以進(jìn)行更改笑窜。換句話說致燥，它將所有新的作用域模型值與以前的作用域值進(jìn)行比較。由于所有監(jiān)視變量都包含在單個(gè)循環(huán)中排截，因此任何變量的任何更改/更新都將導(dǎo)致重新分配DOM中存在的其余監(jiān)視變量嫌蚤。被監(jiān)視的變量處于單個(gè)循環(huán)（摘要循環(huán)）中辐益，任何變量的任何值更改都會(huì)在DOM中重新分配其他被監(jiān)視變量的值

32.區(qū)分DOM和BOM。

33.什么是Angular中的Transpiling箱蝠？

Angular中的編譯是指將源代碼從一種編程語言轉(zhuǎn)換為另一種編程語言的過程续捂。通常，在Angular中宦搬，此轉(zhuǎn)換是從TypeScript到JavaScript的牙瓢。這是一個(gè)隱式過程，在內(nèi)部發(fā)生。

34. How to perform animation in Angular?

為了在Angular應(yīng)用程序中執(zhí)行動(dòng)畫，您需要包括一個(gè)稱為Animate Library的特殊Angular庫竣况，然后將ngAnimate模塊引用到您的應(yīng)用程序中置侍，或者將ngAnimate作為依賴項(xiàng)添加到您的應(yīng)用程序模塊內(nèi)部。

35.什么是Angular中的包含转唉？

Angular中的包含可讓您將指令的原始子代轉(zhuǎn)移到新模板內(nèi)的特定位置。ng指令指示正在使用包含的最近父指令的已包含DOM的插入點(diǎn)。諸如ng-transclude 或 ng-transclude-slot之類的屬性指令主要用于包含汉嗽。

36. Angular中的事件是什么？

Angular中的事件是特定的指令找蜜，可幫助自定義各種DOM事件的行為饼暑。以下列出了Angular支持的事件：

• ng-click
• ng-copy
• ng-cut
• ng-dblclick
• ng-keydown
• ng-keypress
• ng-keyup
• ng-mousedown
• ng-mouseenter
• ng-mouseleave
• ng-mousemove
• ng-mouseover
• ng-mouseup
• ng-blur

37.列出一些用于測試角度應(yīng)用的工具嗎？

• Karma

• Angular Mocks

• Mocha

• Browserify

• Sion

38.如何在Angular中創(chuàng)建服務(wù)洗做？

在Angular中弓叛，服務(wù)是可替換對象，該對象使用依賴項(xiàng)注入連接在一起诚纸。通過將服務(wù)注冊到要在其中執(zhí)行的模塊中來創(chuàng)建服務(wù)撰筷。基本上畦徘，您可以通過三種方式創(chuàng)建角度服務(wù)毕籽。基本上井辆，它們是在Angular中創(chuàng)建服務(wù)的三種方式：

• Factory
• Service
• Provider

39.什么是單例模式关筒，在Angular中可以找到它？

Angular中的Singleton模式是一種很棒的模式杯缺，它限制了一個(gè)類不能被多次使用蒸播。Angular中的Singleton模式主要在依賴項(xiàng)注入和服務(wù)中實(shí)現(xiàn)。因此，如果您不使用“ new Object（）”而未將其設(shè)為單例袍榆，則將為同一對象分配兩個(gè)不同的存儲(chǔ)位置胀屿。而如果將該對象聲明為單例，則如果該對象已存在于內(nèi)存中包雀，則將簡單地將其重用宿崭。

40.您對Angular中的REST了解那些？

REST表示RE表象小號大老牛逼轉(zhuǎn)讓（BOT）才写。REST是適用于HTTP請求的API（應(yīng)用程序編程接口）樣式劳曹。在這種情況下，所請求的URL可以精確定位需要處理的數(shù)據(jù)琅摩。然后铁孵，HTTP方法將標(biāo)識(shí)需要對請求的數(shù)據(jù)執(zhí)行的特定操作。因此房资，遵循此方法的API被稱為RESTful API蜕劝。

41. Angular中的自舉是什么？

在Angular中進(jìn)行引導(dǎo)只是初始化或啟動(dòng)Angular應(yīng)用程序轰异。Angular支持自動(dòng)和手動(dòng)引導(dǎo)岖沛。

• 自動(dòng)引導(dǎo)程序：這是通過將ng-app指令添加到應(yīng)用程序的根目錄來完成的，通常是在標(biāo)記或標(biāo)記上（如果您希望angular自動(dòng)引導(dǎo)應(yīng)用程序）搭独。當(dāng)Angular找到ng-app指令時(shí)婴削，它將加載與其關(guān)聯(lián)的模塊，然后編譯DOM牙肝。
• 手動(dòng)引導(dǎo)： 手動(dòng)引導(dǎo)為您提供了有關(guān)如何以及何時(shí)初始化Angular應(yīng)用程序的更多控制唉俗。如果您想在Angular喚醒并編譯頁面之前執(zhí)行任何其他操作，這將非常有用配椭。

42.在Angular中鏈接和編譯有什么區(qū)別虫溜？

• 編譯功能用于模板DOM操縱并收集所有指令。
• 鏈接功能用于注冊DOM偵聽器以及實(shí)例DOM操作股缸，并在克隆模板后執(zhí)行衡楞。

43. 您對Angular中的常數(shù)有什么了解？

在Angular中敦姻，常量類似于用于定義全局?jǐn)?shù)據(jù)的服務(wù)瘾境。常量使用關(guān)鍵字“ constant”聲明。它們是使用恒定依賴性創(chuàng)建的镰惦，可以注入控制器或服務(wù)中的任何位置迷守。

44. Angular的提供者，服務(wù)和工廠之間有什么區(qū)別陨献？

45. 什么是Angular Global API？

Angular Global API是用于執(zhí)行各種常見任務(wù)的全局JavaScript函數(shù)的組合聘殖，例如：

• 比較對象
• 迭代對象
• 轉(zhuǎn)換數(shù)據(jù)

有一些常見的Angular Global API函數(shù)晨雳，例如：

• 有角的。小寫：將字符串轉(zhuǎn)換為小寫字符串奸腺。
• 有角的餐禁。大寫： 將字符串轉(zhuǎn)換為大寫字符串。
• 有角的突照。isString： 如果當(dāng)前引用是字符串帮非，則返回true。
• 有角的讹蘑。isNumber：如果當(dāng)前引用為數(shù)字末盔，則返回true。

高級水平–面試問題

46.在Angular中座慰，描述如何設(shè)置陨舱，獲取和清除cookie？

為了在Angular中使用cookie版仔，您需要包含一個(gè)名為ngCookies angular-cookies.js的模塊游盲。

設(shè)置Cookies –為了以鍵值格式設(shè)置Cookies，使用“ put”方法蛮粮。

cookie.set("nameOfCookie","cookieValue");

獲取Cookie –為了獲取Cookie背桐，使用了“ get”方法。

cookie.get（"nameOfCookie"）;

清除Cookie –使用“刪除”方法刪除Cookie蝉揍。

cookie.delete（"nameOfCookie"）;

47. 如果您的數(shù)據(jù)模型是在"區(qū)域"之外更新的链峭，請說明該過程，您將如何查看視圖又沾？

您可以使用以下任意一種來更新視圖：

• ApplicationRef.prototype.tick（）：它將對整個(gè)組件樹執(zhí)行更改檢測弊仪。

• NgZone.prototype.run（）：它將對整個(gè)組件樹執(zhí)行更改檢測。在這里杖刷，引擎蓋下的run（）將調(diào)用tick本身励饵，然后參數(shù)將在tick之前獲取函數(shù)并執(zhí)行它。

• ChangeDetectorRef.prototype.detectChanges（）：它將在當(dāng)前組件及其子組件上啟動(dòng)更改檢測滑燃。

48.在Angular中解釋ng-app指令役听。

ng-app指令用于定義Angular應(yīng)用程序，使我們可以在Angular應(yīng)用程序中使用自動(dòng)引導(dǎo)。它表示Angular應(yīng)用程序的根元素典予，通常在或標(biāo)簽附近聲明甜滨。在HTML文檔中可以定義任何數(shù)量的ng-app指令，但是只有一個(gè)Angular應(yīng)用程序可以被隱式地正式引導(dǎo)瘤袖。其余應(yīng)用程序必須手動(dòng)引導(dǎo)衣摩。

例

<div ng-app=“myApp” ng-controller=“myCtrl”>
First Name :
<input type=“text” ng-model=“firstName”>
<br />
Last Name :
<input type=“text” ng-model=“l(fā)astName”>
<br>
Full Name: {{firstName + ” ” + lastName }}
</div>

49.從準(zhǔn)備好的TemplateRef插入嵌入視圖的過程是什么？

@Component({
    selector: 'app-root',
    template: `
        <ng-template #template let-name='fromContext'><div>{{name}}</ng-template>
    `
})
export class AppComponent implements AfterViewChecked {
    @ViewChild('template', { read: TemplateRef }) _template: TemplateRef<any>;
    constructor() { }

    ngAfterViewChecked() {
        this.vc.createEmbeddedView(this._template, {fromContext: 'John'});
    }
}

50.如何僅通過單擊角形按鈕即可隱藏HTML元素捂敌？

可以使用ng-hide指令與控制器一起輕松隱藏HTML元素艾扮，以在單擊按鈕時(shí)隱藏HTML元素。

View

<div ng-controller ="MyController">
  <button ng-click ="hide()">歡迎關(guān)注全棧程序員社區(qū)公眾號</ button>
  <p ng-hide ="isHide">歡迎關(guān)注Java架構(gòu)師社區(qū)公眾號占婉！</ p>
</ div>

Controller

controller: function() {
    this.isHide = false;
    this.hide = function(){
        this.isHide = true; 
    }; 
}

本文轉(zhuǎn)載自：https://www.php.cn/js-tutorial-480383.html

更多編程相關(guān)知識(shí)泡嘴，請?jiān)L問：編程入門！逆济！