How to get the value out of Knockout function

Question

I'm using Knockout and I'm trying to build function that will return a value, The problem is that I'm computing the value inside internal function, and I don't find a way to get the value out of this function.

Thats what I have so far

JS

var vm = {
    myResponse: ko.observable(),
    computedValue: ko.observable()
};

vm.myResponse.subscribe(function (newValue) {
    myfunction(computedValue);
});


var myfunction = function (observableToUpdate) {
    var responses = request.responses();
    return changeUp.getUserInfo().then(function (userInfo) {
        var currentResponse = ko.utils.arrayFirst(responses, function (r) {
            return r.userName === userInfo.userName;
        });
        var responseindex = responses.indexOf(currentResponse);
        observableToUpdate({
            responeIndex: responseindex
        });
    });
};

On my html I'm using following lines

<tbody data-bind="foreach: request.responses()">
<tr data-bind="css: { responder : $parent.vm}">
    <td>{{since()}}</td>
    <td>{{amount|number}}</td>
    <td>{{rate|number}}</td>
    <td>{{distance}}</td>
    <td>
        <a data-bind="click: action">{{_t('Details')}}</a>
</tr>
</tbody>

Currently non of the get the class responder. i want to add it only if the condition in isMyResponse is true;

Answer 1

The only way to use asynchonous callbacks to set an observable is to use subscriptions. A knockout computed expects a synchronous return value.

You function finished execution before the "then" callbacks fire.

var someObservable = ko.observable();
var computedValue = ko.observable();

someObservable.subscribe( function( newValue ) {
    changeup.getUserInfo().then( function(userInfo) {
        ...
        computedValue(myRespondIndex);
    });
} );

Also, "then" callback return value only influences the call chain of the promise. If you throw an exception the fail callback will fire and any chained "then" callback will not be invoked. A returned value does not "cascade" through the callbacks.

Answer 2

For the UserID = 'undefined' , I think that the result of the first then function is being passed to the second then function. The result of the second then function will be undefined as nothing is returned. I think it should probably be something like this:-

this.isMyResponse = function(index) {
    var test ;
    var responses = this.request.responses();
    var useriD = changeup.getUserInfo().then(function (userInfo) {
        var currentResponse = ko.utils.arrayFirst(responses, function (r) {
            return r.username === userInfo.username;
        });
        var myRespondIndex = responses.indexOf(currentResponse);
        test = myRespondIndex;
        console.log("inside" + test);
        return myRespondIndex;
    }).then  (function (index) {
        console.log("outside" + test);
        return index;
    });
    console.log("outside" + test);
    return test;
}

EDIT
The following jsFiddle was my attempt to confirm what Robert Stanley was telling me. In the end I implemented the solution how he suggested.

http://jsfiddle.net/gonefishern/zdDh9/

As Robert Stanley pointed out to me, the following javascript will return a promise but the not values that I thought it was going to.

var isMyResponse = function(observableToUpdate) {
    var responses = this.request.responses();
    return  changeup.getUserInfo().then(function (userInfo) {
        var currentResponse = ko.utils.arrayFirst(responses, function (r) {
            return r.username === userInfo.username;
         });
         return {
             responeIndex: responses.indexOf(currentResponse),
             userInfo: userInfo
         };
    });
}