Angular & Web Components - Using Angular Elements to create Custom Elements

Поділитися
Вставка
  • Опубліковано 10 гру 2024

КОМЕНТАРІ • 16

  • @huw1676
    @huw1676 Рік тому

    Great tutorial! Very well made. Worked a treat. Exactly what I needed.

  • @hellooojoe
    @hellooojoe Рік тому +3

    How would you create a custom web element using a standalone component and a main.ts that just has bootstrapApplication(AppComponent, appConfig).catch(err => console.error(err)); Note that appConfig is where all providers are added.

  • @mihaimicsa2754
    @mihaimicsa2754 7 місяців тому

    Clear and concise, thank you for this!!!

  • @alexcoroza4518
    @alexcoroza4518 10 місяців тому

    The best one i found so far. I still have some questions though.
    1. Angular 17 now defaults new project into using standalone components, meaning there are no modules present by default. I am planning to convert my current widget app into standalone approach in the future. It would be nice it you can create another video tackling this topic.
    2. Another is, how can I test this locally? Is it possible to test it via "ng serve"? Remember we emptied the bootstrap array thats why (maybe) running ng serve does nothing and cannot detect our widget component. The way i can test this currently is by copying the generated files into the public/plain-html folder and running it

  • @sskrishna2711
    @sskrishna2711 8 місяців тому

    Hi, I have one issue and below is a usecase.
    In child application, when clicked on an icon, I am invoking a component based on a route and using the router parameter in the invoked component . After creating custom element for this and using in parent app, and on click of the button, its redirecting to the new route, but child app is not able to fetch the router parameter. Any solution to this.

  • @jashvithaasy7881
    @jashvithaasy7881 Рік тому

    Thank you nice tutorial.. 13:10 u mentioned something like caput syntax.. what is that ?

    • @tootyrnt5533
      @tootyrnt5533 10 місяців тому

      He said "kabob" syntax, which can also be referred to as kabob casing, which is a casing method where a dash is used for variable names longer than 1 word, for example: hello-world or user-name

  • @HarshilPatel-d8n
    @HarshilPatel-d8n 3 місяці тому

    Is it possible to use Angular library in plain HTML file?

  • @FernandoDiegoSantillanVaras
    @FernandoDiegoSantillanVaras 7 місяців тому

    can you teach the example with Angular 17, because dont exists app.module

  • @khanhluan8938
    @khanhluan8938 Рік тому

    Hi, if i can use this custom elements to use in different website only with script difined to point to the url of this element ?

  • @banana828-qf9zn
    @banana828-qf9zn 4 місяці тому

    Cool tutorial and it works... until I want to run it in an HTML. It doesn't generate the runtime.js and I get loads of errors when I try to run the index.html. Anyone got a solution for that?

  • @francoXHardCore
    @francoXHardCore 6 місяців тому

    gracias genio. no sabia como agregar Atributos.

  • @soheiljahangirie2477
    @soheiljahangirie2477 3 місяці тому

    thank you for this video but unfortunately your code in github and the what you showed us is different and if someone just follow the video their code won't get build.

  • @alnes204
    @alnes204 9 місяців тому

    Sadly dont work in Angular 17, like all the others Tutorials ive found.... :-/