sodexo-public-shop-menu-template
The sodexo-public-shop-menu-template component contains the menu feature with built-in API and i18n support. This template is public and does not require authentication.
Properties
| Property | HTML Attribute | Type | Default | Description |
|---|---|---|---|---|
siteExternalId | site-external-id | string | - | Site external identifier. Use it with shopExternalId instead of shopId. Provided by Sodexo |
shopExternalId | shop-external-id | string | - | Shop external identifier. Use it with siteExternalId instead of siteId. Provided by Sodexo |
shopId | shop-id | string | - | Internal shop identifier. Use only if obtained from sodexo-public-shop-list-template |
Property Usage
- External IDs: Use
siteExternalId+shopExternalIdtogether (provided by Sodexo) - Internal ID: Use
shopIdalone (only if retrieved from shop list template) - Do not mix both approaches
Usage
- HTML
<!DOCTYPE html>
<html>
<body>
<sodexo-public-shop-menu-template shop-id="your-shop-id"></sodexo-public-shop-menu-template>
</body>
</html>
Property Naming Convention
Naming Syntax
When using properties:
- In HTML: Use kebab-case (e.g.,
api-key,shop-id) - In JavaScript: Use camelCase (e.g.,
apiKey,shopId) - Events: Can only be handled in JavaScript, not in HTML attributes
Examples
Using External IDs
<sodexo-public-shop-menu-template
site-external-id="site-123"
shop-external-id="shop-456"
></sodexo-public-shop-menu-template>
Using Internal Shop ID
<sodexo-public-shop-menu-template
shop-id="internal-shop-id"
></sodexo-public-shop-menu-template>