diff --git a/src/Umbraco.Web.UI.Client/src/common/resources/relationtype.resource.js b/src/Umbraco.Web.UI.Client/src/common/resources/relationtype.resource.js
index 46df8e2608..81fdbdb838 100644
--- a/src/Umbraco.Web.UI.Client/src/common/resources/relationtype.resource.js
+++ b/src/Umbraco.Web.UI.Client/src/common/resources/relationtype.resource.js
@@ -17,7 +17,7 @@ function relationTypeResource($q, $http, umbRequestHelper) {
             return umbRequestHelper.resourcePromise(
                 $http.get(
                     umbRequestHelper.getApiUrl(
-                        "relationTypeBaseUrl",
+                        "relationTypeApiBaseUrl",
                         "GetById",
                         [{ id: id }]
                     )
diff --git a/src/Umbraco.Web.UI.Client/src/views/relationtypes/edit.controller.js b/src/Umbraco.Web.UI.Client/src/views/relationtypes/edit.controller.js
new file mode 100644
index 0000000000..37eb1ea6d9
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/views/relationtypes/edit.controller.js
@@ -0,0 +1,30 @@
+function RelationTypeEditController($scope, $routeParams, relationTypeResource, editorState, navigationService) {
+
+    var vm = this;
+
+    vm.page = {};
+    vm.page.loading = false;
+    vm.page.saveButtonState = "init";
+    vm.page.menu = {}
+
+    if($routeParams.create) {
+        alert("create");
+    } else {
+        vm.page.loading = true;
+
+        relationTypeResource.getById($routeParams.id)
+            .then(function(data) {
+                vm.relation = data;
+
+                editorState.set(vm.relation);
+
+                navigationService.syncTree({ tree: "relationTypes", path: data.path, forceReload: true }).then(function (syncArgs) {
+                    vm.page.menu.currentNode = syncArgs.node;
+                });
+
+                vm.page.loading = false;
+            });
+    }
+}
+
+angular.module("umbraco").controller("Umbraco.Editors.RelationTypes.EditController", RelationTypeEditController);
diff --git a/src/Umbraco.Web.UI.Client/src/views/relationtypes/edit.html b/src/Umbraco.Web.UI.Client/src/views/relationtypes/edit.html
index 55c5ec2d88..3f88c914f4 100644
--- a/src/Umbraco.Web.UI.Client/src/views/relationtypes/edit.html
+++ b/src/Umbraco.Web.UI.Client/src/views/relationtypes/edit.html
@@ -1,15 +1,13 @@
-<div>
-    <umb-load-indicator ng-if="false"></umb-load-indicator>
+<div data-element="editor-relation-types" ng-controller="Umbraco.Editors.RelationTypes.EditController as vm">
+    <umb-load-indicator ng-if="vm.page.loading"></umb-load-indicator>
 
     <form name="relationTypeForm" novalidate val-form-manager>
-        <umb-editor-view ng-if="true">
+        <umb-editor-view ng-if="!vm.page.loading">
             <umb-editor-header
-                name="Relation type name"
-                alias="relationTypeAlias"
-                key="relationTypeKey"
-                description="something here"
-                description-locked="true"
-                hide-icon="false">
+                name="vm.relation.name"
+                alias="vm.relation.alias"
+                hide-description="true"
+                hide-icon="true">
             </umb-editor-header>
 
             <umb-editor-container class="form-horizontal">
@@ -17,8 +15,8 @@
                     <umb-box-content>
                         <!-- ID -->
                         <umb-control-group label="Id">
-                            <div>1234</div>
-                            <small>0123-4567-8910-abcd</small>
+                            <div>{{vm.relation.id}}</div>
+                            <small>{{vm.relation.key}}</small>
                         </umb-control-group>
 
                         <!-- Direction -->
@@ -26,12 +24,12 @@
                             <ul class="unstyled">
                                 <li>
                                     <label class="radio">
-                                        <input type="radio" name="direction" value="0"> Parent to child
+                                        <input type="radio" name="relationType-direction" ng-model="vm.relation.isBidirectional" ng-value="false"> Parent to child
                                     </label>
                                 </li>
                                 <li>
                                     <label class="radio">
-                                        <input type="radio" name="direction" value="1"> Bidirectional
+                                        <input type="radio" name="relationType-direction" ng-model="vm.relation.isBidirectional" ng-value="true"> Bidirectional
                                     </label>
                                 </li>
                             </ul>
@@ -39,12 +37,12 @@
 
                         <!-- Parent-->
                         <umb-control-group label="Parent">
-                            <div>Document</div>
+                            <div>{{vm.relation.parentObjectTypeName}}</div>
                         </umb-control-group>
 
                         <!-- Child -->
                         <umb-control-group label="Child">
-                            <div>Document</div>
+                            <div>{{vm.relation.childObjectTypeName}}</div>
                         </umb-control-group>
 
                         <!-- Relation count -->
diff --git a/src/Umbraco.Web/Editors/BackOfficeServerVariables.cs b/src/Umbraco.Web/Editors/BackOfficeServerVariables.cs
index 98114f0664..a05ac5338e 100644
--- a/src/Umbraco.Web/Editors/BackOfficeServerVariables.cs
+++ b/src/Umbraco.Web/Editors/BackOfficeServerVariables.cs
@@ -299,6 +299,10 @@ namespace Umbraco.Web.Editors
                         {
                             "languageApiBaseUrl", _urlHelper.GetUmbracoApiServiceBaseUrl<LanguageController>(
                                 controller => controller.GetAllLanguages())
+                        },
+                        {
+                            "relationTypeApiBaseUrl", _urlHelper.GetUmbracoApiServiceBaseUrl<RelationTypeController>(
+                                controller => controller.GetById(1))
                         }
                     }
                 },
diff --git a/src/Umbraco.Web/Editors/RelationTypeController.cs b/src/Umbraco.Web/Editors/RelationTypeController.cs
index cfd6c2e56f..2b9242ef31 100644
--- a/src/Umbraco.Web/Editors/RelationTypeController.cs
+++ b/src/Umbraco.Web/Editors/RelationTypeController.cs
@@ -7,10 +7,10 @@ using System.Threading.Tasks;
 using System.Web.Http;
 using AutoMapper;
 using Umbraco.Core.Models;
+using Umbraco.Web.Models.ContentEditing;
 using Umbraco.Web.Mvc;
 using Umbraco.Web.WebApi.Filters;
 using Constants = Umbraco.Core.Constants;
-using RelationType = Umbraco.Web.Models.ContentEditing.RelationType;
 
 namespace Umbraco.Web.Editors
 {
@@ -26,8 +26,8 @@ namespace Umbraco.Web.Editors
         /// Gets a relation type by ID.
         /// </summary>
         /// <param name="id">The relation type ID.</param>
-        /// <returns>Returns the <see cref="RelationType"/>.</returns>
-        public RelationType GetById(int id)
+        /// <returns>Returns the <see cref="RelationTypeDisplay"/>.</returns>
+        public RelationTypeDisplay GetById(int id)
         {
             var relationType = Services.RelationService.GetRelationTypeById(id);
 
@@ -36,7 +36,7 @@ namespace Umbraco.Web.Editors
                 throw new HttpResponseException(HttpStatusCode.NotFound);
             }
 
-            return Mapper.Map<IRelationType, RelationType>(relationType);
+            return Mapper.Map<IRelationType, RelationTypeDisplay>(relationType);
         }
 
         public void PostSave()
diff --git a/src/Umbraco.Web/Models/ContentEditing/RelationType.cs b/src/Umbraco.Web/Models/ContentEditing/RelationType.cs
index 129376da5c..f52ac507ac 100644
--- a/src/Umbraco.Web/Models/ContentEditing/RelationType.cs
+++ b/src/Umbraco.Web/Models/ContentEditing/RelationType.cs
@@ -3,6 +3,7 @@ using System.Runtime.Serialization;
 
 namespace Umbraco.Web.Models.ContentEditing
 {
+    [Obsolete("Use Umbraco.Web.Models.ContentEditing.RelationTypeDisplay instead")]
     [DataContract(Name = "relationType", Namespace = "")]
     public class RelationType
     {
diff --git a/src/Umbraco.Web/Models/ContentEditing/RelationTypeDisplay.cs b/src/Umbraco.Web/Models/ContentEditing/RelationTypeDisplay.cs
new file mode 100644
index 0000000000..3861e0938d
--- /dev/null
+++ b/src/Umbraco.Web/Models/ContentEditing/RelationTypeDisplay.cs
@@ -0,0 +1,44 @@
+using System;
+using System.ComponentModel;
+using System.Runtime.Serialization;
+
+namespace Umbraco.Web.Models.ContentEditing
+{
+    [DataContract(Name = "relationType", Namespace = "")]
+    public class RelationTypeDisplay : EntityBasic
+    {
+        /// <summary>
+        /// Gets or sets a boolean indicating whether the RelationType is Bidirectional (true) or Parent to Child (false)
+        /// </summary>
+        [DataMember(Name = "isBidirectional", IsRequired = true)]
+        public bool IsBidirectional { get; set; }
+
+        /// <summary>
+        /// Gets or sets the Parents object type id
+        /// </summary>
+        /// <remarks>Corresponds to the NodeObjectType in the umbracoNode table</remarks>
+        [DataMember(Name = "parentObjectType", IsRequired = true)]
+        public Guid ParentObjectType { get; set; }
+
+        /// <summary>
+        /// Gets or sets the Parent's object type name.
+        /// </summary>
+        [DataMember(Name = "parentObjectTypeName")]
+        [ReadOnly(true)]
+        public string ParentObjectTypeName { get; set; }
+
+        /// <summary>
+        /// Gets or sets the Childs object type id
+        /// </summary>
+        /// <remarks>Corresponds to the NodeObjectType in the umbracoNode table</remarks>
+        [DataMember(Name = "childObjectType", IsRequired = true)]
+        public Guid ChildObjectType { get; set; }
+
+        /// <summary>
+        /// Gets or sets the Child's object type name.
+        /// </summary>
+        [DataMember(Name = "childObjectTypeName")]
+        [ReadOnly(true)]
+        public string ChildObjectTypeName { get; set; }
+    }
+}
diff --git a/src/Umbraco.Web/Models/Mapping/RelationMapperProfile.cs b/src/Umbraco.Web/Models/Mapping/RelationMapperProfile.cs
index 31acf4e5e1..95f4fab054 100644
--- a/src/Umbraco.Web/Models/Mapping/RelationMapperProfile.cs
+++ b/src/Umbraco.Web/Models/Mapping/RelationMapperProfile.cs
@@ -1,5 +1,7 @@
 using AutoMapper;
+using Umbraco.Core;
 using Umbraco.Core.Models;
+using Umbraco.Web.Models.ContentEditing;
 using Relation = Umbraco.Web.Models.ContentEditing.Relation;
 using RelationType = Umbraco.Web.Models.ContentEditing.RelationType;
 
@@ -9,6 +11,29 @@ namespace Umbraco.Web.Models.Mapping
     {
         public RelationMapperProfile()
         {
+            // FROM IRelationType to RelationTypeDisplay
+            CreateMap<IRelationType, RelationTypeDisplay>()
+                .ForMember(x => x.Icon, expression => expression.Ignore())
+                .ForMember(x => x.Trashed, expression => expression.Ignore())
+                .ForMember(x => x.Alias, expression => expression.Ignore())
+                .ForMember(x => x.Path, expression => expression.Ignore())
+                .ForMember(x => x.AdditionalData, expression => expression.Ignore())
+                .ForMember(x => x.ChildObjectTypeName, expression => expression.Ignore())
+                .ForMember(x => x.ParentObjectTypeName, expression => expression.Ignore())
+                .ForMember(
+                    x => x.Udi,
+                    expression => expression.MapFrom(
+                        content => Udi.Create(Constants.UdiEntityType.RelationType, content.Key)))
+                .AfterMap((src, dest) =>
+                {
+                    // Build up the path
+                    dest.Path = "-1," + src.Id;
+
+                    // Set the "friendly" names for the parent and child object types
+                    dest.ParentObjectTypeName = ObjectTypes.GetUmbracoObjectType(src.ParentObjectType).GetFriendlyName();
+                    dest.ChildObjectTypeName = ObjectTypes.GetUmbracoObjectType(src.ChildObjectType).GetFriendlyName();
+                });
+
             //FROM IRelationType TO RelationType
             CreateMap<IRelationType, RelationType>();
 
diff --git a/src/Umbraco.Web/Trees/RelationTypeTreeController.cs b/src/Umbraco.Web/Trees/RelationTypeTreeController.cs
index 4930b4dc5e..884b6c5f54 100644
--- a/src/Umbraco.Web/Trees/RelationTypeTreeController.cs
+++ b/src/Umbraco.Web/Trees/RelationTypeTreeController.cs
@@ -65,10 +65,7 @@ namespace Umbraco.Web.Trees
                     queryStrings,
                     rt.Name,
                     "icon-trafic",
-                    false,
-                    //TODO: Rebuild the macro editor in angular, then we dont need to have this at all (which is just a path to the legacy editor)
-                    "/" + queryStrings.GetValue<string>("application") + "/framed/" +
-                    Uri.EscapeDataString("/umbraco/developer/RelationTypes/EditRelationType.aspx?id=" + rt.Id)
+                    false
                     )));
             }
             return nodes;
diff --git a/src/Umbraco.Web/Umbraco.Web.csproj b/src/Umbraco.Web/Umbraco.Web.csproj
index e3bdd95eb4..7e51974bc9 100644
--- a/src/Umbraco.Web/Umbraco.Web.csproj
+++ b/src/Umbraco.Web/Umbraco.Web.csproj
@@ -148,6 +148,7 @@
     <Compile Include="Media\TypeDetector\SvgDetector.cs" />
     <Compile Include="Media\TypeDetector\TIFFDetector.cs" />
     <Compile Include="Media\UploadAutoFillProperties.cs" />
+    <Compile Include="Models\ContentEditing\RelationTypeDisplay.cs" />
     <Compile Include="Models\ContentEditing\RollbackVersion.cs" />
     <Compile Include="Models\ContentEditing\UnpublishContent.cs" />
     <Compile Include="Models\Mapping\MappingOperationOptionsExtensions.cs" />