You aren't limited in using the built-in field editor views (like checkbox, date, datetime, ...) but you can easily plug in your own custom ones.
It's just a matter of pointing the UIOMaticField
attribute to the view location
[UIOMaticField(Name = "Owner", Description = "Select the owner of the dog", View = "~/App_Plugins/Example/picker.person.html")]
[PluginController("Example")]public class ExampleApiController: UmbracoAuthorizedJsonController{public IEnumerable<dynamic> GetAll(){var query = new Sql().Select("*").From("People");return DatabaseContext.Database.Fetch<dynamic>(query);}}
<div ng-controller="Example.Picker.Person"><selectng-model="property.value"ng-options='person.Id as (person.FirstName + " " + person.LastName) for person in persons'><option value="">---Please select---</option></select><br></div>
angular.module("umbraco").controller("Example.Picker.Person",function ($scope,$http) {​$http.get("backoffice/Example/ExampleApi/GetAll").then(function(response) {$scope.persons = response.data;});});
{javascript: ['~/App_Plugins/Example/picker.person.controller.js',]}
As you see this is very similar to creating custom Umbraco property editors, the main difference is that we'll be working with the property.value object (and not model.value)