Я попробовал это Angular Elements Demo
Я скачал, установил и собрал это демо на локальном компьютере.
Затем использовал следующий код:
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Angular Elements Demo</title>
</head>
<body>
<hello-world name="Anna"></hello-world>
<script src="dist/main.js"></script>
<script>
const helloCp = document.querySelector('hello-world');
helloCp.addEventListener('hi', (data) => {
console.log(data.detail);
});
setTimeout(() => {
helloCp.setAttribute('name', 'Marc');
}, 1000);
</script>
</body>
</html>
Затем я попытался Mozilla Firefox, но получил следующую ошибку:
"ReferenceError: customElements is not defined"
С другой стороны, я попытался Google Chrome и !!!это работает правильно !!!
Может быть, мне нужно включить какой-нибудь файл Javascript, например polyfill?Я попробовал некоторые из них, рекомендованные в Интернете, но безуспешно.
Это также не работало на Microsoft Edge и Internet Explorer.
Есть ли способ запустить код на Firefox безнастроить его по умолчанию?
Я имею в виду, в Firefox: about:config
dom.webcomponents.customelements.enabled: true
dom.webcomponents.shadowdom.enabled: true
Я попытался добавить следующий файл Javascript:https://github.com/webcomponents/webcomponentsjs/blob/v1/webcomponents-lite.js
как рекомендовано здесь:https://www.webcomponents.org/polyfills
но успеха не было
Есть идеи, как это решить?
Спасибо за помощь!