KnockoutJS data-bind attr to a function doesn't seem to work

http://stackoverflow.com/questions/9762972/knockoutjs-data-bind-attr-to-a-function-doesnt-seem-to-work

by robgallen

HTML

<script src="https://github.com/SteveSanderson/knockout/raw/master/build/output/knockout-latest.debug.js"></script>
<script src="https://github.com/SteveSanderson/knockout.mapping/raw/master/build/output/knockout.mapping-latest.debug.js"></script>
<ul data-bind="with: paging">
    <li data-bind="foreach: dashboardPage">
        <!-- works fine: -->
        <span data-bind="text: pagenumber"></span>
<!--
But using this doesn't work:
<span data-bind="text: $root.doSomething(pagenumber)"></span>
Error: Object #<viewModel> has no method 'doSomething';
-->
    </li>
</ul>

JavaScript

var myApp = (function () {
    function viewModel(options) {
        // helper function
        var doSomething = function(val) {
          return "P" + val;
        };
        
        // data
        var self = this;
        self.id = ko.observable(options.id);
        self.paging = ko.observable();       

        // operations
        var dummyData = {"dashboardPage":[
            {"active":true, "id":12, "pagenumber":1},
            {"active":true, "id":42, "pagenumber":2},
            {"active":true, "id":65, "pagenumber":3}
        ], "total":3}
        var mapped = ko.mapping.fromJS(dummyData);
        self.paging(mapped);
    };
    
    function get(id) {
        var options = {
            id: id,
            period: "2009-12-01"
        };
        ko.applyBindings(new viewModel(options));
    }
    
    return {
        get: get
    };

} ());

myApp.get(1001);