Creating uMBRACO 7
PROPERTY EDITORS

{
  propertyEditors: [
    {
      alias: "Gibe.Test",
      name: "Test",
      editor: {
        view: "~/App_Plugins/GibeTest/test.html",
        hideLabel: false,
        valueType: "JSON"
      }
    }
  ],
  javascript: [
    "~/App_Plugins/GibeTest/test.controller.js"
  ]
}

<div class="gibe-test" ng-controller="Gibe.TestController">

  <p class="input-prefix">£</p>
  
  <input class="input umb-editor" type="text" ng-model="model.value" />

  <p ng-show="model.value">
    {{model.value}}
  </p>

</div>

angular.module("umbraco")
  .controller("Gibe.TestController", function($scope, assetsService) {
    
    // do some other angular js stuff here...
    // don't forget Umbraco already has jQuery & jQuery.UI

    // load in CSS for view
    assetsService.loadCss("/App_Plugins/GibeTest/test.css");

  }
);

/* useful to prefix with a unique class */

.gibe-test .input
{
  width: 300px;
}

.gibe-test .input-prefix
{
  background: #eee;
  color: #888;
  display: inline-block;
  margin: 0 -5px 0 0;
  padding: 5px 10px;
}