重用 Umbraco 日期时间选择器
Reusing Umbraco datetime picker
Umbraco 7 有这个 date/time 选择器
如何在自定义控件中重用它以避免重新发明轮子?
目前我只有一个纯文本框:
<input type='text' ng-model='validTo' />
可能最简单的方法是在控制器中实例化正确的编辑器并将其绑定到 umbEditor 指令。您的模板可能包含如下内容:
<umb-property ng-if="validTo.hasValue" property="validTo.model">
<umb-editor model="validTo.model"></umb-editor>
</umb-property>
而您的控制器可能包含如下内容:
$scope.validTo = {
model: null,
existingValue: null,
hasValue: false
};
function buildDateTimePickerModel(alias, label, description) {
return {
editor: "Umbraco.DateTime",
label: label,
description: description,
hideLabel: false,
view: "datepicker",
alias: alias,
value: null,
validation: {
mandatory: false,
pattern: ""
},
config: {
format: "YYYY-MM-DD HH:mm:ss",
pickDate: true,
pickTime: true,
useSeconds: true
}
};
};
$scope.validTo.model = buildDateTimePickerModel('validTo', 'Valid To', 'Enter the Valid To date');
或者类似的东西。我没有测试它,但它是从我现有的项目中派生出来的,该项目以类似的方式在自定义 UI 上实现了 ContentPicker。
您可能还会发现这有助于了解可用的配置选项:
Umbraco 7 有这个 date/time 选择器
如何在自定义控件中重用它以避免重新发明轮子?
目前我只有一个纯文本框:
<input type='text' ng-model='validTo' />
可能最简单的方法是在控制器中实例化正确的编辑器并将其绑定到 umbEditor 指令。您的模板可能包含如下内容:
<umb-property ng-if="validTo.hasValue" property="validTo.model">
<umb-editor model="validTo.model"></umb-editor>
</umb-property>
而您的控制器可能包含如下内容:
$scope.validTo = {
model: null,
existingValue: null,
hasValue: false
};
function buildDateTimePickerModel(alias, label, description) {
return {
editor: "Umbraco.DateTime",
label: label,
description: description,
hideLabel: false,
view: "datepicker",
alias: alias,
value: null,
validation: {
mandatory: false,
pattern: ""
},
config: {
format: "YYYY-MM-DD HH:mm:ss",
pickDate: true,
pickTime: true,
useSeconds: true
}
};
};
$scope.validTo.model = buildDateTimePickerModel('validTo', 'Valid To', 'Enter the Valid To date');
或者类似的东西。我没有测试它,但它是从我现有的项目中派生出来的,该项目以类似的方式在自定义 UI 上实现了 ContentPicker。
您可能还会发现这有助于了解可用的配置选项: