Questions tagged [angular-elements]

Angular Elements compiles Angular Components into framework-agnostic Web Components.

Angular Elements compiles Angular Components into regular Web Components, which can be used outside of Angular, in any framework, such as React, or just in regular HTML.

301 questions
4
votes
0 answers

Angular 6 Custom Element inside InnerHtml Keeps Reloading

I successfully wrote an Angular 6 app which works fine. It is loading some content from a remote server, which contains some HTML-code. This code is displayed e.g. inside a DIV-element like this: another.component.html
uruk
  • 1,094
  • 2
  • 14
  • 26
3
votes
0 answers

Angular Elements using ngx-build-plus and npm publish

I am trying to build an app that: contains angular elements publish this app in npm as a library Install the library in a different angular application use the custom element created in this new application I am half way there. I am able to…
Kshri
  • 414
  • 3
  • 16
3
votes
0 answers

Difference between Angular Module Federation and Angular Elements

Can anyone explain to me the difference between Angular Module Federation and Angular Elements? I am new to Angular and my understanding so far is that both are two ways to provide shared Web Components? But is there a key reason to use one or the…
BigTman
  • 142
  • 6
3
votes
1 answer

Reset Angular router state in webcomponent (angular elements)

I have a simple microfrontend scenario that loads and embeds an angular 13 webcomponent (created with angular elements) in a container webapp. Basically, the routing works fine. When leaving the route, the ng web components gets an ngOnDestroy and…
Andre Albert
  • 1,386
  • 8
  • 17
3
votes
0 answers

How to include a web-component in an external project but the components assets originating from a different URL than the one hosted on shopify?

There is currently a project where we need to use web components made in angular in a shopify store. The webcomponent is hosted in www.example.com. The shopify store is hosted on www.myshopifystore.com. The component itself is 3D configurator built…
Gaurav
  • 41
  • 1
  • 1
  • 8
3
votes
1 answer

Angular Material not working with Angular Elements

I'm trying to create a set of Angular Elements using Angular Material. When I run the Angular app everything works just fine. However, once I export my element the things using Angular Material just break. This is what is in my component
3
votes
2 answers

Angular Elements: How to pass a template to the component?

I built an Angular component that displays an array of markers on a map. When one of these markers gets clicked a popup will be displayed. The content of this popup can be defined by the user of my component. I solved this by accepting an…
Sebi
  • 2,534
  • 2
  • 26
  • 28
3
votes
1 answer

How to define a custom element method with angular elements

Our Angular-Elements webcomponent should have the two methods openModal() and closeModal() that can be used as custom-element inside React, Vue or any other library to change the visibility state. This simple javascript usage should be…
d0x
  • 11,040
  • 17
  • 69
  • 104
3
votes
0 answers

Is there a way to wrap an AngularJS component into a web component using Angular Element?

We currently have a hybrid application that consists of AngularJS and Angular 9. We are in the process of trying to get the entire application over to Angular 9 but are running into some difficulties. We are currently using ngUpgrade to help us but…
B Snow
  • 393
  • 3
  • 14
3
votes
1 answer

Reading data from Angular Elements Web Component in plain JavaScript

I'm building a few WebComponent that I'll be using across different libraries/frameworks, but mostly with plain vanilla JavaScript. I'm considering using Angular Elements for this, and built a sample one following few documents. It works fine, with…
Arghya C
  • 9,805
  • 2
  • 47
  • 66
3
votes
1 answer

Is it possible to include an img src inside of Angular Element?

I'm working with Angular 8 and trying to create a reusable Web Component using the createCustomElement() command in the Angular Elements package "@angular/elements" So the component itself is very simple. It just contains a some wrapper HTML code…
3
votes
2 answers

Angular library: Separate HttpInterceptor

What I want to achieve An encapsulated application (form editor) that I can use inside another angular application, but also in any web application. Idea The main modules/components could be implemented as angular library (main component as shadow…
3
votes
3 answers

Angular Elements doesn't include Material Theme css properly

I have included Angular Material in my angular element project. I have included all the references how the documentation suggests, but when I build seems like angular the material theme isn't included at all. This is the link for watching what I…
Bonfry
  • 163
  • 2
  • 12
3
votes
1 answer

Angular Elements - Uncaught TypeError: Failed to construct 'HTMLElement'

I have been trying to get an Angular elements component working, as I was considering using them in an upcoming project. I have followed a number of tutorials (all very similar), and just cannot get them working. One of the tutorials is this one. I…
peterc
  • 6,921
  • 9
  • 65
  • 131
3
votes
1 answer

Contain the Style of my Angular Web Component so it doesn't bleed to the component to which it is used

We have build a new webcomponent using Angular v6. Now the problem is when i use the component in a Blank app it works flawlessly but when i use it in a existing app it disrupts the css completely. The reason i could find is as i am uing bootstrap…
Rahul Singh
  • 19,030
  • 11
  • 64
  • 86