DevExtreme dxTileVie with DataSource

HTML

<script src="http://cdnjs.cloudflare.com/ajax/libs/knockout/3.1.0/knockout-min.js"></script>
<script src="http://ajax.aspnetcdn.com/ajax/globalize/0.1.1/globalize.min.js"></script>
<link rel="stylesheet" href="http://cdn3.devexpress.com/jslib/14.2.3/css/dx.common.css">
<link rel="stylesheet" href="http://cdn3.devexpress.com/jslib/14.2.3/css/dx.light.css">
<script src="http://cdn3.devexpress.com/jslib/14.2.5/js/dx.phonejs.js"></script>
<div id="mitarbeiter" data-bind="dxTileView: {
           noDataText: 'no data', 
           dataSource:dataSource
      }">
    <div data-options="dxTemplate : { name: 'item' }" class="tile">
      <h2 data-bind="text: name"></h2>
      <p data-bind="text: projectName"></p>
    </div>
  </div>

CSS

.dx-tile {
    background: lightyellow;
}

JavaScript

$(function() {
    
    var dataSource = new DevExpress.data.DataSource({
        load: function (loadOptions) {
            var deferred = new $.Deferred();
            
            setTimeout(function() {
                deferred.resolve([
                    { Name: "1" },
                    { Name: "2" },
                    { Name: "3" }
                ]);
            }, 2000);
            
            return deferred.promise();
        },
        map: function(item) {
            return { 
                name: item.Name, 
                projectName: "Project: " + item.Name 
            };
        }
    });
    
    ko.applyBindings({
        dataSource: dataSource
    }); 
});