Āut Labs
  • Āut Labs
  • The Āutonomy Matrix
  • $AUT Token
  • 🎯What is Āut Labs
    • Intro & History
    • Problem & Solution
    • The Āutonomy Matrix
    • Product Suite
  • ♟️Core Concepts
    • ĀutID
    • Hub
    • Roles
    • Tasks & Contributions
    • Prestige
    • Member <> Hub bond
    • Commitment Level
    • Participation Score
    • Peer Value
  • 💻For Devs
    • Deployed Contracts
      • ĀutID
      • Hub
      • Tasks
      • Participation Score
      • Miscellaneous
    • Integrate dĀut (Web Component)
      • For Angular
      • For Vue.js
      • For React
    • SDK
  • 🎳Product Suite
    • Launchpad
    • HubOS
    • d-Āut
    • Explorer
    • ĀutOS
Powered by GitBook
LogoLogo

PARTICIPATE

  • Website
  • ĀutOS
  • Hub Explorer

© Āut Labs 2025

On this page
  1. For Devs
  2. Integrate dĀut (Web Component)

For Angular

  1. Install the library

    npm i @aut-labs/d-aut --save
  2. Import the initialization function in the app.component.ts

    import { Init } from '@aut-labs/d-aut';
  3. Call the Init function inside ngOnInit

    ngOnInit(): void { Init(); }
  4. Add the CUSTOM_ELEMENTS_SCHEMA in your app.module.ts

    import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core';
  5. Add the custom HTML tag and populate the partner-key property

app.component.ts:

import { Component, OnInit } from '@angular/core';
import { Init } from '@aut-labs/d-aut;

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css'],
})
export class AppComponent implements OnInit {
  ngOnInit(): void {
    Init();
  }
  title = 'ngular-app';
}

app.module.ts:

import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';

import { AppComponent } from './app.component';

@NgModule({
  schemas: [CUSTOM_ELEMENTS_SCHEMA],
  declarations: [AppComponent],
  imports: [BrowserModule],
  providers: [],
  bootstrap: [AppComponent],
})
export class AppModule {}

app.component.ts:

<d-aut dao-expander="0x94C5A2d8B75D139FE02180Fd7Ce87EC55B01b358"></d-aut>

PreviousIntegrate dĀut (Web Component)NextFor Vue.js

Last updated 3 months ago

💻