欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

angular強(qiáng)制更新ui視圖的實(shí)現(xiàn)方法

 更新時(shí)間：2023年03月04日 13:37:08   作者：前端開(kāi)發(fā)者--小明  
這篇文章主要介紹了angular強(qiáng)制更新ui視圖的實(shí)現(xiàn)方法，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教

angular 強(qiáng)制更新ui視圖方法

強(qiáng)制更新ui視圖方法主要用在數(shù)據(jù)已經(jīng)改變，但是ui展示視圖不跟新情況

1 主要使用方法類 ChangeDetectorRef

Angular 各種視圖的基礎(chǔ)類，提供變更檢測(cè)功能。

變更檢測(cè)樹(shù)會(huì)收集要檢查的所有視圖。

使用這些方法從樹(shù)中添加或移除視圖、初始化變更檢測(cè)并顯式地把這些視圖標(biāo)記為臟的，意思是它們變了、需要重新渲染。

1.1類方法一：markForCheck()

當(dāng)輸入已更改或視圖中發(fā)生了事件時(shí)，組件通常會(huì)標(biāo)記為臟的（需要重新渲染）。調(diào)用此方法會(huì)確保即使那些觸發(fā)器沒(méi)有被觸發(fā)，也仍然檢查該組件。

1.2類方法一：detach()

從變更檢測(cè)樹(shù)中分離開(kāi)視圖。 已分離的視圖在重新附加上去之前不會(huì)被檢查。 與 detectChanges() 結(jié)合使用，可以實(shí)現(xiàn)局部變更檢測(cè)。

即使已分離的視圖已標(biāo)記為臟的，它們?cè)谥匦赂郊由先ブ耙膊粫?huì)被檢查。

1.3類方法一：detectChanges()

檢查該視圖及其子視圖。與 detach 結(jié)合使用可以實(shí)現(xiàn)局部變更檢測(cè)。

1.4類方法一：checkNoChanges()

檢查變更檢測(cè)器及其子檢測(cè)器，如果檢測(cè)到任何更改，則拋出異常。

1.5類方法一：reattach()

把以前分離開(kāi)的視圖重新附加到變更檢測(cè)樹(shù)上。 視圖會(huì)被默認(rèn)附加到這棵樹(shù)上。引入 ChangeDetectorRef

import { ChangeDetectorRef } from '@angular/core';

2 賦值引入

constructor(private ref: ChangeDetectorRef) { }

3方法中調(diào)用

? ? this.ref.markForCheck();?? ?// 就是在拿到數(shù)據(jù)后，執(zhí)行這兩行代碼，這是關(guān)鍵
? ? this.ref.detectChanges();

angular踩坑 數(shù)據(jù)發(fā)生改變，視圖未更新

大多數(shù)情況下，頁(yè)面的視圖會(huì)隨著數(shù)據(jù)的改變而改變，少數(shù)情況下，數(shù)據(jù)變了，而視圖不更新。

左側(cè)的視圖，右側(cè)數(shù)據(jù)，數(shù)據(jù)改變時(shí)，視圖未更新。。。。具體原因呢，可能是angular 臟檢查沒(méi)有檢測(cè)到數(shù)據(jù)更新吧。。。

解決方案

引入 ChangeDetectorRef ,使視圖強(qiáng)刷。

import { Component, OnInit, Input, ChangeDetectorRef} from '@angular/core';

 總結(jié)

以上為個(gè)人經(jīng)驗(yàn)，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。

相關(guān)文章

最新評(píng)論