I'd like to add a datetime picker field type to Umbraco Forms, with appropriate view and edit formatting in the back office.

Using the RenderView and EditView properties on the field type definition allows me to specify the HTML views, but to have things formatted nicely I would need to add Angular controllers to the Umbraco Forms script.

Is there a way to do this?

DateTimePicker.cs

using Umbraco.Forms.Core;
using Umbraco.Forms.Core.Enums;

namespace Site.Infrastructure.Forms.Fields
{
    public class DateTimePicker : FieldType
    {
        public DateTimePicker()
        {
            Id = new Guid("96dea277-049b-4e64-a4fa-dc03066eb3ad");
            Name = "Datetime";
            Description = "Render a datetime picker.";
            Icon = "icon-time";
            DataType = FieldDataType.DateTime;
            SupportsRegex = false;
            RenderView = "datetime";
            EditView = "datetime";
            FieldTypeViewName = "FieldType.DateTimePicker.cshtml";
        }
    }
}

EditTypes/datetime.html:

<div ng-controller="UmbracoForms.EditTypes.DateController as vm">
    <input type="datetime-local" ng-model="vm.value" style="width: 400px" ng-change="vm.change()" ng-keydown="detail.validationMessages = []">
    <div class="umb-validation-label" ng-repeat="validationMessage in detail.validationMessages">{{validationMessage}}</div>
</div>

RenderTypes/datetime.html

<div ng-controller="UmbracoForms.RenderTypes.DateController">
    <div ng-show="field">{{formatDate(field) | date:'d MMM y h:mm a'}}</div>
</div>