Выбирайте привязку «optionsCaption», отображать только при соблюдении определенных условий - PullRequest
Новая
       62

Выбирайте привязку «optionsCaption», отображать только при соблюдении определенных условий

0 голосов
/ 07 января 2020

У меня есть скрипт KO. js на моей проверке Magento2 

return Component.extend({
        defaults: {
            template: 'Magento_NegotiableQuote/shipping-address/list',
            visible: addressList().length > 0,
            showOptionCaptionText:addressList().length > 1,
            rendererTemplates: [],
            AddressList: [],            
            DropdownComponentRendererIndex:50
        }

        /**
         * Render My Custom Component 
         */
        createRendererDropdownComponent: function() {
              var rendererTemplate, templateData, rendererComponent;

              rendererTemplate = utils.extend({}, DropdownRendererTemplate);

              templateData = {
                    parentName: this.name,
                    name: 'shipping-addressall-dropdown'
                };

              rendererComponent = utils.template(rendererTemplate, templateData);               
              this.selectedItem = ko.observable(); 

              this.selectedItem.subscribe(function(latest){
                  selectShippingAddressAction(latest);
                  checkoutData.setSelectedShippingAddress(latest,latest.getKey());
                  this.createNewRendererComponent(latest,0);
                  },this);

              utils.extend(rendererComponent, {
                    allAddress: ko.observableArray(this.AddressList),
                    selectedItem: this.selectedItem,
                    showOptionCaptionText:this.showOptionCaptionText,
                });  

             layout([rendererComponent]);                
             this.rendererComponents[this.DropdownComponentRendererIndex] = rendererComponent;


        }

enter image description here

<div class="field addresses">
    <div class="control">
       <select  class="select select2" name="shipping_address_id" data-bind="
        options: allAddress,
        optionsText:addressOptionsText,
        optionsCaption: '---Please Select Address --',
        value: selectedItem" afterRender="selectTwo()">
        </select>  

    </div>     
</div>

Возможно ли добавить текст optionsCaption, основанный на условии? Я приложил изображение ниже. Если это значение равно false, я хочу удалить текст optionsCaption? В общем, все, что мне нужно, - это если в раскрывающемся списке есть только один элемент для выбора, затем выбрать его автоматически, а если имеется несколько параметров, отобразить текст-заполнитель --- SELECT ---.

1 Ответ

1 голос
/ 07 января 2020

Я снимаю здесь в темноте (еще не проверял), но я думаю, что вы можете рассчитать заголовок параметров. 

computedCaption: ko.computed(function () {
    return addressList().length > 1 ? 'Select address' : null;
})

, а затем создать свой выбор следующим образом 

<select ... data-bind="
    ....
    optionsCaption: computedCaption(),
    ....
</select>
...