KnockoutTest

by rodneyjoyce

HTML

<script src="http://knockoutjs.com/downloads/knockout-2.2.1.js"></script>
<script src="https://raw.github.com/SteveSanderson/knockout.mapping/master/build/output/knockout.mapping-latest.debug.js"></script>
Why does this not appear when it is bound to Info.Title?
<div data-bind="text: Info.Title"></div>

<hr/>
But this does when I use the with statement?
<div data-bind="with: Info">
    <div>
         <h1 data-bind="text: Title"></h1>

    </div>
</div>

JavaScript

function MapInfo(data) {
        this.Title = ko.observable(data.title);
    }

    function DareDetailViewModel() {
        var self = this;
        self.Info = ko.observable();

        var flickerAPI = "http://api.flickr.com/services/feeds/photos_public.gne?jsoncallback=?";
        $.getJSON(flickerAPI, {
            format: "json"
        })
        .done(function (data) 
        {
            console.log(data);
            console.log(ko.mapping.fromJS(data));
        });
    };

    ko.applyBindings(new DareDetailViewModel());