Skip to content

template

Use template strings to replace placeholders, supporting both object and array data.

Basic Usage

typescript
import { template } from 'radash'

const templateStr = 'Hello {{name}}, welcome to {{company}}!'
const data = { name: 'Alice', company: 'Tech Corp' }

console.log(template(templateStr, data)) // 'Hello Alice, welcome to Tech Corp!'

Syntax

typescript
function template(str: string, data: Record<string, any>): string

Parameters

  • str (string): Template string containing placeholders
  • data (Record<string, any>): Data object for replacing placeholders

Return Value

Returns a string with placeholders replaced.

Examples

Basic Template Replacement

typescript
import { template } from 'radash'

const templateStr = 'Hello {{name}}, you are {{age}} years old.'
const data = { name: 'Alice', age: 25 }

const result = template(templateStr, data)
console.log(result) // 'Hello Alice, you are 25 years old.'

Handling Missing Placeholders

typescript
import { template } from 'radash'

const templateStr = 'Hello {{name}}, welcome to {{company}}!'
const data = { name: 'Alice' } // company is missing

const result = template(templateStr, data)
console.log(result) // 'Hello Alice, welcome to !'

Handling Nested Objects

typescript
import { template } from 'radash'

const templateStr = 'User: {{user.name}}, Email: {{user.email}}, Age: {{user.profile.age}}'
const data = {
  user: {
    name: 'Alice',
    email: 'alice@example.com',
    profile: {
      age: 25
    }
  }
}

const result = template(templateStr, data)
console.log(result) // 'User: Alice, Email: alice@example.com, Age: 25'

Handling Array Data

typescript
import { template } from 'radash'

const templateStr = 'First item: {{items.0}}, Second item: {{items.1}}'
const data = {
  items: ['apple', 'banana', 'orange']
}

const result = template(templateStr, data)
console.log(result) // 'First item: apple, Second item: banana'

Handling Complex Nesting

typescript
import { template } from 'radash'

const templateStr = `
User Profile:
- Name: {{user.profile.name}}
- Email: {{user.profile.email}}
- Address: {{user.profile.address.city}}, {{user.profile.address.country}}
- Skills: {{user.skills.0}}, {{user.skills.1}}
`

const data = {
  user: {
    profile: {
      name: 'Alice',
      email: 'alice@example.com',
      address: {
        city: 'Beijing',
        country: 'China'
      }
    },
    skills: ['JavaScript', 'TypeScript', 'React']
  }
}

const result = template(templateStr, data)
console.log(result)
// User Profile:
// - Name: Alice
// - Email: alice@example.com
// - Address: Beijing, China
// - Skills: JavaScript, TypeScript

Handling Different Value Types

typescript
import { template } from 'radash'

const templateStr = 'Name: {{name}}, Age: {{age}}, Active: {{isActive}}, Score: {{score}}'
const data = {
  name: 'Alice',
  age: 25,
  isActive: true,
  score: 95.5
}

const result = template(templateStr, data)
console.log(result) // 'Name: Alice, Age: 25, Active: true, Score: 95.5'

Handling Null and Undefined

typescript
import { template } from 'radash'

const templateStr = 'Name: {{name}}, Email: {{email}}, Phone: {{phone}}'
const data = {
  name: 'Alice',
  email: null,
  phone: undefined
}

const result = template(templateStr, data)
console.log(result) // 'Name: Alice, Email: , Phone: '

Handling Special Characters

typescript
import { template } from 'radash'

const templateStr = 'Message: {{message}}, URL: {{url}}'
const data = {
  message: 'Hello & Welcome!',
  url: 'https://example.com?param=value'
}

const result = template(templateStr, data)
console.log(result) // 'Message: Hello & Welcome!, URL: https://example.com?param=value'

Handling Function Values

typescript
import { template } from 'radash'

const templateStr = 'Name: {{name}}, Greeting: {{greeting}}'
const data = {
  name: 'Alice',
  greeting: () => 'Hello!'
}

const result = template(templateStr, data)
console.log(result) // 'Name: Alice, Greeting: function'

Handling Object Values

typescript
import { template } from 'radash'

const templateStr = 'User: {{user}}, Settings: {{settings}}'
const data = {
  user: { name: 'Alice', age: 25 },
  settings: { theme: 'dark', notifications: true }
}

const result = template(templateStr, data)
console.log(result) // 'User: [object Object], Settings: [object Object]'

Handling Array Values

typescript
import { template } from 'radash'

const templateStr = 'Tags: {{tags}}, Numbers: {{numbers}}'
const data = {
  tags: ['javascript', 'typescript', 'react'],
  numbers: [1, 2, 3, 4, 5]
}

const result = template(templateStr, data)
console.log(result) // 'Tags: javascript,typescript,react, Numbers: 1,2,3,4,5'

Handling Date Values

typescript
import { template } from 'radash'

const templateStr = 'Created: {{createdAt}}, Updated: {{updatedAt}}'
const data = {
  createdAt: new Date('2023-01-01'),
  updatedAt: new Date('2023-12-31')
}

const result = template(templateStr, data)
console.log(result) // 'Created: 2023-01-01T00:00:00.000Z, Updated: 2023-12-31T00:00:00.000Z'

Handling Boolean Values

typescript
import { template } from 'radash'

const templateStr = 'Active: {{isActive}}, Verified: {{isVerified}}, Premium: {{isPremium}}'
const data = {
  isActive: true,
  isVerified: false,
  isPremium: true
}

const result = template(templateStr, data)
console.log(result) // 'Active: true, Verified: false, Premium: true'

Handling Number Values

typescript
import { template } from 'radash'

const templateStr = 'ID: {{id}}, Score: {{score}}, Rating: {{rating}}'
const data = {
  id: 123,
  score: 95.5,
  rating: 4.8
}

const result = template(templateStr, data)
console.log(result) // 'ID: 123, Score: 95.5, Rating: 4.8'

Handling Empty Strings

typescript
import { template } from 'radash'

const templateStr = 'Name: {{name}}, Description: {{description}}'
const data = {
  name: 'Alice',
  description: ''
}

const result = template(templateStr, data)
console.log(result) // 'Name: Alice, Description: '

Handling Zero Values

typescript
import { template } from 'radash'

const templateStr = 'Count: {{count}}, Price: {{price}}, Rating: {{rating}}'
const data = {
  count: 0,
  price: 0.0,
  rating: 0
}

const result = template(templateStr, data)
console.log(result) // 'Count: 0, Price: 0, Rating: 0'

Handling Complex Templates

typescript
import { template } from 'radash'

const templateStr = `
# User Profile

## Basic Information
- **Name**: {{user.name}}
- **Email**: {{user.email}}
- **Age**: {{user.age}}

## Address
- **City**: {{user.address.city}}
- **Country**: {{user.address.country}}
- **Postal Code**: {{user.address.postalCode}}

## Preferences
- **Theme**: {{user.preferences.theme}}
- **Language**: {{user.preferences.language}}
- **Notifications**: {{user.preferences.notifications}}

## Skills
- **Primary**: {{user.skills.0}}
- **Secondary**: {{user.skills.1}}
- **Additional**: {{user.skills.2}}
`

const data = {
  user: {
    name: 'Alice Smith',
    email: 'alice@example.com',
    age: 25,
    address: {
      city: 'Beijing',
      country: 'China',
      postalCode: '100000'
    },
    preferences: {
      theme: 'dark',
      language: 'en',
      notifications: true
    },
    skills: ['JavaScript', 'TypeScript', 'React']
  }
}

const result = template(templateStr, data)
console.log(result)

Handling API Response Templates

typescript
import { template } from 'radash'

const templateStr = `
API Response:
- Status: {{status}}
- Message: {{message}}
- Data: {{data}}
- Timestamp: {{timestamp}}
- Request ID: {{requestId}}
`

const data = {
  status: 200,
  message: 'Success',
  data: { id: 1, name: 'Alice' },
  timestamp: new Date().toISOString(),
  requestId: 'req_123456'
}

const result = template(templateStr, data)
console.log(result)

Handling Error Message Templates

typescript
import { template } from 'radash'

const templateStr = 'Error {{code}}: {{message}} at {{location}}'
const data = {
  code: 404,
  message: 'Resource not found',
  location: '/api/users/999'
}

const result = template(templateStr, data)
console.log(result) // 'Error 404: Resource not found at /api/users/999'

Handling Email Templates

typescript
import { template } from 'radash'

const templateStr = `
Subject: Welcome to {{company}}, {{name}}!

Dear {{name}},

Welcome to {{company}}! We're excited to have you on board.

Your account details:
- Username: {{username}}
- Email: {{email}}
- Role: {{role}}

Best regards,
The {{company}} Team
`

const data = {
  name: 'Alice Smith',
  company: 'Tech Corp',
  username: 'alice.smith',
  email: 'alice@example.com',
  role: 'Software Developer'
}

const result = template(templateStr, data)
console.log(result)

Handling Configuration File Templates

typescript
import { template } from 'radash'

const templateStr = `
# Application Configuration

## Server Settings
server:
  host: {{server.host}}
  port: {{server.port}}
  timeout: {{server.timeout}}

## Database Settings
database:
  url: {{database.url}}
  pool:
    min: {{database.pool.min}}
    max: {{database.pool.max}}

## API Settings
api:
  baseUrl: {{api.baseUrl}}
  version: {{api.version}}
`

const data = {
  server: {
    host: 'localhost',
    port: 3000,
    timeout: 5000
  },
  database: {
    url: 'postgresql://localhost:5432/mydb',
    pool: {
      min: 1,
      max: 10
    }
  },
  api: {
    baseUrl: 'https://api.example.com',
    version: 'v1'
  }
}

const result = template(templateStr, data)
console.log(result)

Handling HTML Templates

typescript
import { template } from 'radash'

const templateStr = `
<div class="user-card">
  <h2>{{user.name}}</h2>
  <p>Email: {{user.email}}</p>
  <p>Age: {{user.age}}</p>
  <p>Location: {{user.location}}</p>
  <div class="skills">
    <h3>Skills:</h3>
    <ul>
      <li>{{user.skills.0}}</li>
      <li>{{user.skills.1}}</li>
      <li>{{user.skills.2}}</li>
    </ul>
  </div>
</div>
`

const data = {
  user: {
    name: 'Alice Smith',
    email: 'alice@example.com',
    age: 25,
    location: 'Beijing, China',
    skills: ['JavaScript', 'TypeScript', 'React']
  }
}

const result = template(templateStr, data)
console.log(result)

Handling SQL Query Templates

typescript
import { template } from 'radash'

const templateStr = `
SELECT {{fields}}
FROM {{table}}
WHERE {{conditions}}
ORDER BY {{orderBy}}
LIMIT {{limit}}
`

const data = {
  fields: 'id, name, email, created_at',
  table: 'users',
  conditions: 'status = "active" AND age > 18',
  orderBy: 'created_at DESC',
  limit: 10
}

const result = template(templateStr, data)
console.log(result)

Differences from Other Methods

  • String.replace(): Native string replacement, limited functionality
  • template(): Template string replacement method provided by radash
  • lodash.template(): Similar functionality, but different syntax

Practical Application Scenarios

  1. Email Templates: Generate personalized email content
  2. HTML Templates: Generate dynamic HTML content
  3. Configuration Files: Generate configuration file content
  4. Error Messages: Generate formatted error messages
  5. API Responses: Format API response content

Released under the MIT License.