How to Access Internationalization Properties in LWC Component?

Question

I have created a sample LWC component and trying to use Internationalization Properties to change the LWC component's viewing language from English to any end-user language.

I have followed this document - https://developer.salesforce.com/docs/platform/lwc/guide/create-i18n.html

My JS Code is -

// languageExample.js
import { LightningElement } from "lwc";
import LANG from "@salesforce/i18n/lang";
import DIR from "@salesforce/i18n/dir";

export default class LanguageExample extends LightningElement {
   lang = LANG;
   dir = DIR;
}

My HTML Code is -

<!-- languageExample.html -->
<template>
    <p lang={lang} dir={dir}><!-- Localized text in a paragraph --></p>
</template>

I am trying to convert paragraph tag content into Other language from by default English language. I have followed the document but its not working.

Can anyone suggest what I might be doing wrong. Thanks in Advance.