Fix for issue #38

addon/components/dynamic-form.js

@@ -133,6 +133,8 @@ const DynamicForm = Ember.Component.extend({
         if (typeObj) {
           object[key] = typeObj[type.functionName];
         } // else fail with a message that the given type couldn't be found
+      } else if (value === null) {
+        object[key] = '';
       } else if (typeof value === 'object') {
         object[key] = _.transform(value, replaceWithFunction);
       } else {

addon/renderers/alpaca.js

@@ -4,4 +4,4 @@ export default Ember.Object.extend({
   render(schema, element) {
     element.alpaca(schema);
   }
-})
+});

tests/integration/components/null-data-test.js

@@ -0,0 +1,52 @@
+import hbs from 'htmlbars-inline-precompile';
+import { moduleForComponent, test } from 'ember-qunit';
+
+const schemaObject = {
+  "schema": {
+    "title": "What do you think of Alpaca?",
+    "type": "object",
+    "properties": {
+      "name": {
+        "type": "string",
+        "title": "Name"
+      },
+      "feedback": {
+        "type": "string",
+        "title": "Feedback"
+      },
+      "ranking": {
+        "type": "string",
+        "title": "Ranking",
+        "enum": ['excellent', 'not too shabby', 'alpaca built my hotrod']
+      }
+    }
+  },
+  "view": "bootstrap-display-horizontal"
+};
+
+
+const dataObject = {
+  "name": "Todd Jordan",
+  "ranking": null,
+  "feedback": null
+};
+
+moduleForComponent('/dynamic-form', 'Integration | Component | dynamic-form:null-data', {
+  integration: true
+});
+
+test('should render empty string for null value in display mode', function (assert) {
+  let fixtureSchema = _.clone(schemaObject, true);
+  let done = assert.async();
+  fixtureSchema.postRender = () => {
+    assert.equal(this.$('.alpaca-control[name="name"]').text(), "Todd Jordan");
+    assert.equal(this.$('.alpaca-control[name="feedback"]').text(), "");
+    assert.equal(this.$('.alpaca-control[name="ranking"]').text().trim(), "");
+    done();
+  };
+  this.set('schemaObject', fixtureSchema);
+  this.set('dataObject', dataObject);
+  this.render(hbs`{{dynamic-form schema=schemaObject data=dataObject}}`);
+
+
+});