René's URL Explorer Experiment


Title: Angular Elements imported by Angular have inconsistent lifecycle · Issue #66588 · angular/angular · GitHub

Open Graph Title: Angular Elements imported by Angular have inconsistent lifecycle · Issue #66588 · angular/angular

X Title: Angular Elements imported by Angular have inconsistent lifecycle · Issue #66588 · angular/angular

Description: Which @angular/* package(s) are the source of the bug? elements Is this a regression? No. This has been the case for as long as I have used Angular, at least 3 years. Description When an Angular component imports another Angular componen...

Open Graph Description: Which @angular/* package(s) are the source of the bug? elements Is this a regression? No. This has been the case for as long as I have used Angular, at least 3 years. Description When an Angular co...

X Description: Which @angular/* package(s) are the source of the bug? elements Is this a regression? No. This has been the case for as long as I have used Angular, at least 3 years. Description When an Angular co...

Opengraph URL: https://github.com/angular/angular/issues/66588

X: @github

direct link

Domain: patch-diff.githubusercontent.com


Hey, it has json ld scripts:
{"@context":"https://schema.org","@type":"DiscussionForumPosting","headline":"Angular Elements imported by Angular have inconsistent lifecycle","articleBody":"### Which @angular/* package(s) are the source of the bug?\n\nelements\n\n### Is this a regression?\n\nNo. This has been the case for as long as I have used Angular, at least 3 years.\n\n### Description\n\nWhen an Angular component imports another Angular component, `ngOnInit`, `effect`s and `resource`s are called once the inputs are set.\n\nWhen an Angular component imports an **Angular Elements element**, `ngOnInit`, `effect`s and `resource`s are called before the inputs are set.\n\nThere seems to be no alternative lifecycle hook to know when the inputs have indeed been set.\n\n### Please provide a link to a minimal reproduction of the bug\n\nhttps://stackblitz.com/edit/angular-fpq5sqat?file=src%2Fmain.ts,src%2Fsub-component.ts,src%2Findex.html,package.json\n\n### Please provide the exception or error you saw\n\n```true\nIn the Angular component, `ngOnInit` is correctly called with values.\n\nIn the Angular Elements element, `ngOnInit` is called with undefined inputs.\n```\n\n### Please provide the environment you discovered this bug in (run `ng version`)\n\n```true\nSee Stackblitz, 21.1.0 for all the packages. However, this dates back at least to Angular 15.\n```\n\n### Anything else?\n\nIf an input is marked as required, the following error is logged.\n\n```\nError: NG0950: Input \"id\" is required but no value is available yet. Find more at https://v21.angular.dev/errors/NG0950\n```\n\nNote that this error only applies for dynamic inputs. With the following example, `language = input.required()` does work.\n\n```html\n\u003ccomponent-as-element [id]=\"id()\" language=\"de\" /\u003e\n```\n\nI have also tested with `[attr.]`, to force that the fields are passed as attributes rather than properties, with the hope that this would mean that they could be passed as soon as the element is created, but this did not change anything.\n\n```html\n\u003ccomponent-as-element [attr.id]=\"id()\" [attr.language]=\"language()\" /\u003e\n```","author":{"url":"https://github.com/c-harding","@type":"Person","name":"c-harding"},"datePublished":"2026-01-15T16:36:04.000Z","interactionStatistic":{"@type":"InteractionCounter","interactionType":"https://schema.org/CommentAction","userInteractionCount":0},"url":"https://github.com/66588/angular/issues/66588"}

route-pattern/_view_fragments/issues/show/:user_id/:repository/:id/issue_layout(.:format)
route-controllervoltron_issues_fragments
route-actionissue_layout
fetch-noncev2:8345bf04-c1e0-5a52-3a0c-4e862f9233d2
current-catalog-service-hash81bb79d38c15960b92d99bca9288a9108c7a47b18f2423d0f6438c5b7bcd2114
request-idA602:139CD4:F5C080:142DBEF:696B66B6
html-safe-nonce379d69e2cade2254a3b4e77a62f31e90874c194ee582fbe3ea776a871dfc987a
visitor-payloadeyJyZWZlcnJlciI6IiIsInJlcXVlc3RfaWQiOiJBNjAyOjEzOUNENDpGNUMwODA6MTQyREJFRjo2OTZCNjZCNiIsInZpc2l0b3JfaWQiOiIyMDczMjU5MzM5MjE5MTY2OTAyIiwicmVnaW9uX2VkZ2UiOiJpYWQiLCJyZWdpb25fcmVuZGVyIjoiaWFkIn0=
visitor-hmacd77313b8b8fcf69c2f5585b1f59eacf0cfc0b623587dff5becfbedb8633c2685
hovercard-subject-tagissue:3818291477
github-keyboard-shortcutsrepository,issues,copilot
google-site-verificationApib7-x98H0j5cPqHWwSMm6dNU4GmODRoqxLiDzdx9I
octolytics-urlhttps://collector.github.com/github/collect
analytics-location///voltron/issues_fragments/issue_layout
fb:app_id1401488693436528
apple-itunes-appapp-id=1477376905, app-argument=https://github.com/_view_fragments/issues/show/angular/angular/66588/issue_layout
twitter:imagehttps://opengraph.githubassets.com/acdbb5f6f5ca18fee707d202b86f14e6fc2ff355a4c04da8cebddf65683fb373/angular/angular/issues/66588
twitter:cardsummary_large_image
og:imagehttps://opengraph.githubassets.com/acdbb5f6f5ca18fee707d202b86f14e6fc2ff355a4c04da8cebddf65683fb373/angular/angular/issues/66588
og:image:altWhich @angular/* package(s) are the source of the bug? elements Is this a regression? No. This has been the case for as long as I have used Angular, at least 3 years. Description When an Angular co...
og:image:width1200
og:image:height600
og:site_nameGitHub
og:typeobject
og:author:usernamec-harding
hostnamegithub.com
expected-hostnamegithub.com
None5f99f7c1d70f01da5b93e5ca90303359738944d8ab470e396496262c66e60b8d
turbo-cache-controlno-preview
go-importgithub.com/angular/angular git https://github.com/angular/angular.git
octolytics-dimension-user_id139426
octolytics-dimension-user_loginangular
octolytics-dimension-repository_id24195339
octolytics-dimension-repository_nwoangular/angular
octolytics-dimension-repository_publictrue
octolytics-dimension-repository_is_forkfalse
octolytics-dimension-repository_network_root_id24195339
octolytics-dimension-repository_network_root_nwoangular/angular
turbo-body-classeslogged-out env-production page-responsive
disable-turbofalse
browser-stats-urlhttps://api.github.com/_private/browser/stats
browser-errors-urlhttps://api.github.com/_private/browser/errors
release82560a55c6b2054555076f46e683151ee28a19bc
ui-targetfull
theme-color#1e2327
color-schemelight dark

Links:

Skip to contenthttps://patch-diff.githubusercontent.com/angular/angular/issues/66588#start-of-content
https://patch-diff.githubusercontent.com/
Sign in https://patch-diff.githubusercontent.com/login?return_to=https%3A%2F%2Fgithub.com%2Fangular%2Fangular%2Fissues%2F66588
GitHub CopilotWrite better code with AIhttps://github.com/features/copilot
GitHub SparkBuild and deploy intelligent appshttps://github.com/features/spark
GitHub ModelsManage and compare promptshttps://github.com/features/models
MCP RegistryNewIntegrate external toolshttps://github.com/mcp
ActionsAutomate any workflowhttps://github.com/features/actions
CodespacesInstant dev environmentshttps://github.com/features/codespaces
IssuesPlan and track workhttps://github.com/features/issues
Code ReviewManage code changeshttps://github.com/features/code-review
GitHub Advanced SecurityFind and fix vulnerabilitieshttps://github.com/security/advanced-security
Code securitySecure your code as you buildhttps://github.com/security/advanced-security/code-security
Secret protectionStop leaks before they starthttps://github.com/security/advanced-security/secret-protection
Why GitHubhttps://github.com/why-github
Documentationhttps://docs.github.com
Bloghttps://github.blog
Changeloghttps://github.blog/changelog
Marketplacehttps://github.com/marketplace
View all featureshttps://github.com/features
Enterpriseshttps://github.com/enterprise
Small and medium teamshttps://github.com/team
Startupshttps://github.com/enterprise/startups
Nonprofitshttps://github.com/solutions/industry/nonprofits
App Modernizationhttps://github.com/solutions/use-case/app-modernization
DevSecOpshttps://github.com/solutions/use-case/devsecops
DevOpshttps://github.com/solutions/use-case/devops
CI/CDhttps://github.com/solutions/use-case/ci-cd
View all use caseshttps://github.com/solutions/use-case
Healthcarehttps://github.com/solutions/industry/healthcare
Financial serviceshttps://github.com/solutions/industry/financial-services
Manufacturinghttps://github.com/solutions/industry/manufacturing
Governmenthttps://github.com/solutions/industry/government
View all industrieshttps://github.com/solutions/industry
View all solutionshttps://github.com/solutions
AIhttps://github.com/resources/articles?topic=ai
Software Developmenthttps://github.com/resources/articles?topic=software-development
DevOpshttps://github.com/resources/articles?topic=devops
Securityhttps://github.com/resources/articles?topic=security
View all topicshttps://github.com/resources/articles
Customer storieshttps://github.com/customer-stories
Events & webinarshttps://github.com/resources/events
Ebooks & reportshttps://github.com/resources/whitepapers
Business insightshttps://github.com/solutions/executive-insights
GitHub Skillshttps://skills.github.com
Documentationhttps://docs.github.com
Customer supporthttps://support.github.com
Community forumhttps://github.com/orgs/community/discussions
Trust centerhttps://github.com/trust-center
Partnershttps://github.com/partners
GitHub SponsorsFund open source developershttps://github.com/sponsors
Security Labhttps://securitylab.github.com
Maintainer Communityhttps://maintainers.github.com
Acceleratorhttps://github.com/accelerator
Archive Programhttps://archiveprogram.github.com
Topicshttps://github.com/topics
Trendinghttps://github.com/trending
Collectionshttps://github.com/collections
Enterprise platformAI-powered developer platformhttps://github.com/enterprise
GitHub Advanced SecurityEnterprise-grade security featureshttps://github.com/security/advanced-security
Copilot for BusinessEnterprise-grade AI featureshttps://github.com/features/copilot/copilot-business
Premium SupportEnterprise-grade 24/7 supporthttps://github.com/premium-support
Pricinghttps://github.com/pricing
Search syntax tipshttps://docs.github.com/search-github/github-code-search/understanding-github-code-search-syntax
documentationhttps://docs.github.com/search-github/github-code-search/understanding-github-code-search-syntax
Sign in https://patch-diff.githubusercontent.com/login?return_to=https%3A%2F%2Fgithub.com%2Fangular%2Fangular%2Fissues%2F66588
Sign up https://patch-diff.githubusercontent.com/signup?ref_cta=Sign+up&ref_loc=header+logged+out&ref_page=%2F%3Cuser-name%3E%2F%3Crepo-name%3E%2Fvoltron%2Fissues_fragments%2Fissue_layout&source=header-repo&source_repo=angular%2Fangular
Reloadhttps://patch-diff.githubusercontent.com/angular/angular/issues/66588
Reloadhttps://patch-diff.githubusercontent.com/angular/angular/issues/66588
Reloadhttps://patch-diff.githubusercontent.com/angular/angular/issues/66588
angular https://patch-diff.githubusercontent.com/angular
angularhttps://patch-diff.githubusercontent.com/angular/angular
Notifications https://patch-diff.githubusercontent.com/login?return_to=%2Fangular%2Fangular
Fork 27k https://patch-diff.githubusercontent.com/login?return_to=%2Fangular%2Fangular
Star 99.7k https://patch-diff.githubusercontent.com/login?return_to=%2Fangular%2Fangular
Code https://patch-diff.githubusercontent.com/angular/angular
Issues 1k https://patch-diff.githubusercontent.com/angular/angular/issues
Pull requests 105 https://patch-diff.githubusercontent.com/angular/angular/pulls
Discussions https://patch-diff.githubusercontent.com/angular/angular/discussions
Actions https://patch-diff.githubusercontent.com/angular/angular/actions
Projects 2 https://patch-diff.githubusercontent.com/angular/angular/projects
Security Uh oh! There was an error while loading. Please reload this page. https://patch-diff.githubusercontent.com/angular/angular/security
Please reload this pagehttps://patch-diff.githubusercontent.com/angular/angular/issues/66588
Insights https://patch-diff.githubusercontent.com/angular/angular/pulse
Code https://patch-diff.githubusercontent.com/angular/angular
Issues https://patch-diff.githubusercontent.com/angular/angular/issues
Pull requests https://patch-diff.githubusercontent.com/angular/angular/pulls
Discussions https://patch-diff.githubusercontent.com/angular/angular/discussions
Actions https://patch-diff.githubusercontent.com/angular/angular/actions
Projects https://patch-diff.githubusercontent.com/angular/angular/projects
Security https://patch-diff.githubusercontent.com/angular/angular/security
Insights https://patch-diff.githubusercontent.com/angular/angular/pulse
New issuehttps://patch-diff.githubusercontent.com/login?return_to=https://github.com/angular/angular/issues/66588
New issuehttps://patch-diff.githubusercontent.com/login?return_to=https://github.com/angular/angular/issues/66588
Angular Elements imported by Angular have inconsistent lifecyclehttps://patch-diff.githubusercontent.com/angular/angular/issues/66588#top
area: elementsIssues related to Angular Elementshttps://github.com/angular/angular/issues?q=state%3Aopen%20label%3A%22area%3A%20elements%22
needsTriagehttps://github.com/angular/angular/milestone/83
https://github.com/c-harding
https://github.com/c-harding
c-hardinghttps://github.com/c-harding
on Jan 15, 2026https://github.com/angular/angular/issues/66588#issue-3818291477
https://stackblitz.com/edit/angular-fpq5sqat?file=src%2Fmain.ts,src%2Fsub-component.ts,src%2Findex.html,package.jsonhttps://stackblitz.com/edit/angular-fpq5sqat?file=src%2Fmain.ts,src%2Fsub-component.ts,src%2Findex.html,package.json
area: elementsIssues related to Angular Elementshttps://github.com/angular/angular/issues?q=state%3Aopen%20label%3A%22area%3A%20elements%22
needsTriageNo due datehttps://github.com/angular/angular/milestone/83
https://github.com
Termshttps://docs.github.com/site-policy/github-terms/github-terms-of-service
Privacyhttps://docs.github.com/site-policy/privacy-policies/github-privacy-statement
Securityhttps://github.com/security
Statushttps://www.githubstatus.com/
Communityhttps://github.community/
Docshttps://docs.github.com/
Contacthttps://support.github.com?tags=dotcom-footer

Viewport: width=device-width


URLs of crawlers that visited me.