Skip to content

Hosting a Web Component inside an angular app. Data binding and change tracking is not working. #24901

@SchneiderMK

Description

@SchneiderMK

I'm submitting (maybe) a...


[ ] Regression (a behavior that used to work and stopped working in a new release)
[x] Bug report  
[ ] Performance issue
[ ] Feature request
[ ] Documentation issue or request
[ ] Support request => Please do not submit support request here, instead see https://github.com/angular/angular/blob/master/CONTRIBUTING.md#question
[ ] Other... Please describe:

Current behavior

I've developed a web component with @angular/elements. When I'm hosting the web component inside an angular app, change tracking and data binding is not working.
Hosting the web component outside angular (plain html) works fine.

Expected behavior

Web components should work in an angular app.

Minimal reproduction of the problem with instructions

Due hosting on stackblitz is not possible, I've create a demo project to show the behavior.
https://github.com/SchneiderMK/angular-elements-demo

What is the motivation / use case for changing the behavior?

We like to develop a micro frontend. The shell app and some parts of the micro services are developed with angular. We like to use Web Components to integrate the different components.

Environment


Angular version: 6.0.3


Browser:
- [x] Chrome (desktop) version XX
- [ ] Chrome (Android) version XX
- [ ] Chrome (iOS) version XX
- [ ] Firefox version XX
- [ ] Safari (desktop) version XX
- [ ] Safari (iOS) version XX
- [ ] IE version XX
- [ ] Edge version XX
 
For Tooling issues:
- Node version: V10.1.0  
- Platform:  Windows

Others:

Metadata

Metadata

Assignees

No one assigned

    Labels

    area: elementsIssues related to Angular Elements

    Type

    No type

    Projects

    No projects

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions