@luoxiao123/angular-material-date-time-range-picker 21.1.1 → 21.1.3

package/README.md

@@ -100,8 +100,8 @@ export class AppComponent {
 
   onRangeSelected(range: DateTimePickerValue | undefined) {
     if (range) {
-      console.log('Start:', range.start);  // ISO 8601 format
-      console.log('End:', range.end);      // ISO 8601 format
+      console.log('Start:', range.start);  // 格式化后的字符串 (如 "2024-01-24 14:30") 或时间戳
+      console.log('End:', range.end);      // 格式化后的字符串 (如 "2024-01-24 14:30") 或时间戳
     }
   }
 }
@@ -160,20 +160,6 @@ import { DatePickerComponent } from '@luoxiao123/angular-material-date-time-rang
 export class DateRangeModule {}
 ```
 
-## 使用指南
-
-### Standalone Components
-
-推荐用于现代 Angular 应用的方式。直接在组件 imports 中使用。
-
-### mat-form-field 集成
-
-组件完美适配 Angular Material 的 `mat-form-field`，可自动应用表单样式和错误提示。
-
-### 双向数据绑定
-
-支持 `[(ngModel)]` 和响应式表单 `[formControl]`。
-
 ## API 文档
 
 ### 输入属性
@@ -183,8 +169,9 @@ export class DateRangeModule {}
 | `ngModel` / `formControl` | `DateTimePickerValue \| null` | - | 选中的日期时间范围（支持双向绑定） |
 | `required` | `boolean` | `false` | 是否为必填项 |
 | `disabled` | `boolean` | `false` | 是否禁用组件 |
-| `valueFormat` | `string` | `'yyyy-MM-dd HH:mm:ss'` | 值的输出格式（DatePipe 格式） |
+| `placeholder` | `string` | `''` | 输入框占位符 |
 | `future` | `boolean` | `false` | 是否允许选择未来日期 |
+| `isTimestamp` | `boolean` | `false` | 是否使用时间戳（毫秒）作为输入/输出值 |
 
 ### 输出事件
 
@@ -198,31 +185,11 @@ export class DateRangeModule {}
 
 | 属性 | 类型 | 说明 |
 |------|------|------|
-| `start` | `string` | 开始日期时间 (ISO 8601) |
-| `end` | `string` | 结束日期时间 (ISO 8601) |
-
-#### TimeRange
-
-| 属性 | 类型 | 说明 |
-|------|------|------|
-| `label` | `string` | 显示标签 |
-| `start` | `string` | 开始时间表达式 |
-| `end` | `string` | 结束时间表达式 |
+| `start` | `string \| number` | 格式化后的日期时间字符串 (如 "2024-01-24 14:30") 或时间戳 (毫秒) |
+| `end` | `string \| number` | 格式化后的日期时间字符串 (如 "2024-01-24 14:30") 或时间戳 (毫秒) |
 
 ## 配置
 
-### 基础示例
-
-```typescript
-<date-time-picker 
-  [(ngModel)]="selectedRange"
-  [required]="true"
-  [disabled]="isLoading"
-  [future]="false"
-  (selectionChange)="onRangeSelected($event)"
-/>
-```
-
 ### 自定义日期格式
 
 组件使用 Angular Material 的 `DateAdapter` 和 `MAT_DATE_FORMATS` 进行日期格式化。您可以在应用或组件级别提供自定义的适配器和格式。
@@ -264,10 +231,17 @@ ngOnInit() {
   const startDate = new Date(now.getFullYear(), now.getMonth(), 1);
   const endDate = new Date(now.getFullYear(), now.getMonth() + 1, 0);
   
+  // 默认模式（字符串）
   this.selectedRange = {
-    start: startDate.toISOString(),
+    start: startDate.toISOString(), // 推荐使用 ISO 字符串作为初始值
     end: endDate.toISOString()
   };
+
+  // 时间戳模式（如果启用了 isTimestamp="true"）
+  // this.selectedRange = {
+  //   start: startDate.getTime(),
+  //   end: endDate.getTime()
+  // };
 }
 ```
 
@@ -316,7 +290,10 @@ A: 当前版本使用中文界面。欢迎提交 PR 添加多语言支持。
 A: 支持。组件使用标准的 Material Design 样式，可通过 CSS 变量和自定义 CSS 进行定制。
 
 ### Q: 如何处理时区问题？
-A: 组件使用 ISO 8601 格式，完整支持时区信息。
+A: 
+- **默认模式**：组件返回的日期时间字符串基于本地时间（Local Time），格式化结果取决于 `MAT_DATE_FORMATS` 配置。
+- **时间戳模式**：如果启用了 `isTimestamp="true"`，组件返回的是 UTC 时间戳（毫秒）。
+如果需要处理时区转换，建议在获取值后使用 `date-fns` 或 `moment.js` 等库。
 
 ## 贡献