Angular

Angular Implementation

For the Angular Implementation, you will need to install Angular CLI globally on your machine. You can install it, by running on the terminal:

npm install -g @angular/cli

(we assume that you have node.js installed on your computer)

To create a new workspace and an initial application, you will need to run:

ng new angular

Navigate to the folder in the terminal by using cd angular, and then run the following command to launch the app:

ng serve --open

CMPv1 Implementation

Open index.html in your app directory

Add the following script to the <head> tag:

//Change 'xxxxxx' to your settingsID
<script>
   window.usercentrics = {
    settingsId: 'xxxxxx'
  };
  window["usercentrics"] = {
    paths: {
      "bundle": "https://app.usercentrics.eu/latest/bundle.js",
    },
    settingsIds: 'xxxxxx',
    settingsVersionOverwrite: 'preview',
  };
</script>

Then save and the localhost will reload and load into the page, the bundle.js.

CMPv2 Implementation

Open index.html in your app directory

Add the following script to the <head> tag:

//Change 'xxxxxx' to your settingsID

//Normal Bundle
<script id="usercentrics-cmp" data-settings-id="xxxxxx" src="https://app.usercentrics.eu/browser-ui/latest/bundle.js" data-tcf-enabled></script>

//Legacy Bundle
<script id="usercentrics-cmp" data-settings-id="xxxxxx" src="https://app.usercentrics.eu/browser-ui/latest/bundle_legacy.js" defer></script>

Then save and the localhost will reload and load into the page, the bundle.js