How to use Knockout Mapping plugin in Hottowel

334 views Asked by At

i was able to install ko.mapping in VisualStudio but when i try to map some Json Data in my view it does not work. can anyone tell me what i am doing wrong ?

here is my viewmodel

define(['plugins/router', 'knockout', 'services/logger', 'durandal/app', 'mapping'], function (router, ko, logger, app, mapping) {

    //#region Internal Methods
    function activate() {
        logger.log('Google Books View Activated', null, 'books', true);
        return true;
    }
    //#endregion
    //==jquery=================================================
    function attached() {


    }//-->end of viewAttached() 

    //========VIEWMODEL========================================
    var ViewModel = function (data) {
        activate = activate;
        attached = attached;
        title = 'google Books';

    };

    return new ViewModel();

});

and here ist an working example in Jsfiddle

1

There are 1 answers

2
Nathan Fisher On BEST ANSWER

I don't think that you don't need to return a new View Model. you just need to return the view model.

define(['plugins/router', 'knockout', 'services/logger', 'durandal/app', 'mapping'],
  function (router, ko, logger, app, mapping) {
    var books = ko.observableArray();
    function activate() {
      getBooks().then(function(){
        logger.log('Google Books View Activated', null, 'books', true);
        return true;
      });
    }
    function attached() {
    }
    function getBooks(){
      $.getJSON(url, function (data) {
        vm.books(ko.mapping.fromJS(data));
        return true;
      });
    }

    var vm = {
      activate : activate,
      attached : attached,
      title : 'google Books',
      books: books
    };

    return vm;
});

EDIT
To find requirejs errors add to your main.js file. It should help in tracking down requirejs module loading errors.

requirejs.onError = function (err) {
    console.log(err.requireType);
    if (err.requireType === 'timeout') {
        console.log('modules: ' + err.requireModules);
    }

    throw err;
};