0

I have Created custom component with select drop down when I select an option and alert the select option it spits out :

 function observable() {
          if (arguments.length > 0) {
             // Write

             // Ignore writes if the value hasn't changed
        if (observable.isDifferent(_latestValue, arguments[0])) {
            observable.valueWillMutate();
            _latestValue = arguments[0];
            if (DEBUG) observable._latestValue = _latestValue;
            observable.valueHasMutated();
        }
        return this; // Permits chained assignments
    }
    else {
        // Read
        ko.dependencyDetection.registerDependency(observable); // The caller only needs to be notified of changes if they did a "read" operation
        return _latestValue;
    }
}

I have :

availableCountries : ko.observableArray(['--Please Select--', 'France', 'Germany', 'Spain']), chosenCountries : ko.observableArray(['--Please Select--']),

I can display just fine like so:

<span data-bind="text: chosenCountries"></span>

I can push from my function just fine like so:

this.availableCountries.push('New item')

BUT I CAN'T from my function

alert(this.availableCurrencies)

or

console.log(this.availableCurrencies)

it spits the the observable function above!

UPADTE: I did console.log(this.availableCurrencies._latestValue); and it gives me the previous value how to get currnetValue?

Full js component :

define(
    [
        'uiComponent',
        'jquery',
        'Magento_Checkout/js/model/step-navigator',
        'Magento_Checkout/js/model/quote',
        'ko'
    ],
    function (Component, $, stepNavigator, quote, ko) {
        'use strict';
        return Component.extend({
            defaults: {
                template: 'Magento_Checkout/view/summary/country'
            },
            availableCountries : ko.observableArray(['--Please Select--', 'France', 'Germany', 'Spain']),
            chosenCountries : ko.observableArray(['--Please Select--']),
            initialize: function () {
                this._super();
                return this;
            },
            getCountry:function (data, event) {
                console.log(this.chosenCoutries());
            }

        });
    }
);

and country.html:

<div>
    <select data-bind="event:{ change: getCountry}, options: availableCountries, selectedOptions: chosenCountries"></select>
    <span data-bind="text: chosenCountries"></span>

</div>

enter image description here enter image description here Anyone nay help please!Appreciate

0

It looks like you need to add parenthesis like so:

console.log(this.availableCurrencies());

Without the parenthesis you will only log the function, and to set the observable you add content inside the parentheis like this:

this.testObservable('New value');
  • Thank's The same this tried with parentheses it gives me the previous value how do i get the current ? – Juliano Vargas May 18 '18 at 15:59
  • this.availableCurrencies() always should be the current, if you're getting the wrong value it's usually when you're setting the value outside of KO like this.availableCurrencies = whatever. I think the issue is around the usage of _latestValue - As far as I'm aware you shouldn't really use this. All my uses have been: - this.getObservableTest(); - this.setObservableTest(newValue); – Ben Crook May 18 '18 at 16:05
  • It doesn't seen to give the current value I've update with full code perhaps you can spot something worng? – Juliano Vargas May 18 '18 at 16:23
  • There is a typo here - console.log(this.chosenCoutries());. This should be console.log(this.chosenCountries());. Does fixing that change anything? – Ben Crook May 18 '18 at 16:27
  • 1
    I've manage to get the current value by adding timeout,@Ben Crook It works if I add a timeout: setTimeout(function(){ console.log(data. chosenCountries()); }, 1000); Thank's for you help! – Juliano Vargas May 18 '18 at 16:47

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.