Stack Overflow
Stack Overflow

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
30
votes
3 answers

Why does Angular build create files with 'es5' and 'es2015' but not 'es6' (or no suffix at all)?

I recently downloaded the Angular CLI (@angular/cli 9.0.1). I then proceeded to create a new application so that I could create a new Angular Element, package it up, and use it in another application. After following a few blogs, the final step of…
michael
  • 787
  • 2
  • 6
  • 12
22
votes
1 answer

How to mix Angular Elements with the "ng g library" approach?

As you know, the "ng g library" approach helps us with the creation of libraries of reusable components. But what if I wanted those components to be compiled into web components... through the support of Angular Elements? Not only that but also that…
Fabio Nolasco
  • 7,122
  • 6
  • 35
  • 32
16
votes
4 answers

How to Compile Angular Element Into Web Component w/ Webpack or Angular CLI?

I built a simple Web Component via Angular using Pascal Precht's tutorial, which you can see working HERE. It auto-magically compiles in the on Stackblitz in the link, but not locally. My end goal is to have the code for the resulting Web Component…
VSO
  • 11,546
  • 25
  • 99
  • 187
15
votes
7 answers

Build angular element from existing project

We have an existing Angular 8 project which includes a bunch of common components (like custom datepickers, numeric inputs, ...). The project itself is a standard Angular-app. We want to extract some of these components as Angular elements that they…
Stefan
  • 1,007
  • 1
  • 11
  • 32
15
votes
2 answers

Angular Elements: dependency on Material

I'm creating an Angular Element to be used in other projects. The element is a component containing Angular Material components in its template, so ultimately my element requires that the page to a Material theme CSS file (and material icons…
Alexander Taylor
  • 16,574
  • 14
  • 62
  • 83
13
votes
2 answers

Angular Elements - pass a complicated input to my web component

I started lately to play a little bit with angular elements that was released in angular V6, I opened a small sandbox project for that purpose. https://github.com/Slash7GNR/ndv-angular-elements Now I've tried to add a more complicated input to my…
Slash7GNR
  • 479
  • 4
  • 13
12
votes
2 answers

Zone.js has detected that ZoneAwarePromise `(window|global).Promise` has been overwritten in custom element

I created a small app using angular custom elements feature (element.js), imported that element.js file into another angular(parent) app in index.html, in development server (ng serve) element feature works fine, but in production mode (ng build…
selvin john
  • 141
  • 1
  • 6
11
votes
1 answer

Angular Element not resolving routes(?) in another angular project, instead only "" is shown on Website

following starting point: We have a few angular frontend micro-services, and now we want to bring them together in one app. We are trying the Angular-Elements approach and we have exported one of the microservices which yielded a huge JS-file. The…
mehlichmeyer
  • 154
  • 1
  • 18
10
votes
1 answer

Angular Element in an Angular app creates an infinite reloading issue when optimized

TL;DR: I’m trying to use Angular Elements as plugins for an Angular application. If I build the element with --prod it works with ng serve on my app (development setup), but it goes into infinite reloading when I use it with ng serve --prod on my…
DAEMonRaco
  • 190
  • 2
  • 10
10
votes
1 answer

Script inside shadow dom not working

I've created and exported one Angular Element (web component in Angular) as a single script tag (user-poll.js). To use this Angular Element I just need to specify below two lines in the host site:
Saurabh Palatkar
  • 3,242
  • 9
  • 48
  • 107
9
votes
1 answer

Argument of type 'NgElementConstructor' is not assignable to parameter of type 'CustomElementConstructor'

I'm getting a strange warning in VSCode( 1.44.0-insider ) with Angular9 in creating Angular Elements: export class AppModule { constructor(private injector: Injector) { const helloElement = createCustomElement(HelloComponent, {injector}); …
Stepan Suvorov
  • 25,118
  • 26
  • 108
  • 176
8
votes
0 answers

How to share service between angular app and angular element

I have an angular app upgraded to angular 9 and I am using angular element in it which is also upgraded to angular 9. I have a service module (angular 9) which I am importing in my angular app. My angular element also imports the same service. I…
Brana
  • 81
  • 3
8
votes
0 answers

Generate different js bundles for each component using @angular/elements

I have a huge Angular application where a couple of components are exported as @angular/elements. These components (although they still use shared services and components) are used in a different section of the website which is not part of the…
Christian Vincenzo Traina
  • 9,546
  • 2
  • 40
  • 63
8
votes
1 answer

Creating radio buttons in Shadow DOM

The problem arises when we are going to create a custom radio button as a web component using Shadow Dom. Normally when we are using radio buttons, we usually give the same name to the grouped radio boxes, like this.
Kavinda Jayakody
  • 705
  • 1
  • 13
  • 25
8
votes
1 answer

Angular Elements vs Angular Library?

My team works with multiple angular projects. For code reuse, we have a lot of presentational components extracted into libraries, which we then use in our various projects. So, given that all our projects are on angular, and we already use…
Somjit
  • 2,503
  • 5
  • 33
  • 60
1
2 3
…
20 21