Skip to content

Instantly share code, notes, and snippets.

@AregSargsyan

AregSargsyan/changeDetectionWithPlainJs.html

Last active May 28, 2020 18:59
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save AregSargsyan/cd308a80ce5e228b6daa9eb68ebf187d to your computer and use it in GitHub Desktop.
Save AregSargsyan/cd308a80ce5e228b6daa9eb68ebf187d to your computer and use it in GitHub Desktop.
Download ZIP
Change detection with plain JS
Raw
changeDetectionWithPlainJs.html
<html>
<div id="dataDiv"></div>
<button id="btn" (click)="handler()"> ClickMe </button>
<script>
let count = 0;
// initial rendering
detectChange();
function renderHTML() {
document.getElementById('dataDiv').innerText = count;
}
function detectChange() {
const currentValue = document.getElementById('dataDiv').innerText;
if (currentValue !== count) {
renderHTML();
}
}
// update data inside button click event handler
document.getElementById('btn').addEventListener('click', () => {
// update count
count ++;
// call detectChange manually
detectChange();
});
</script>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment