Показать / скрыть на основе выбора раскрывающегося списка в KnockoutJS с моделью внутри другой модели

Я работаю над «Правилами» для конструктора форм.

Я хочу показать/скрыть текстовое поле на основе выбранного раскрывающегося списка.

Например, предположим, что у нас есть следующие «Правила» для элемента управления «TextField» в «Построителе форм».

Rule#   Control(dropdown)          Condition(dropdown)          Value(as input textbox)

1       TextBox_1                    Is filled out             (Text Input NOT REQUIRED)

2       TextBox_2                        Contains                         Hi

Исходя из вышеизложенного, для правила 1 ввод текста не требуется, а для правила 2 требуется ввод текста.

Выше мой сценарий.

Что я пробовал:

HTML-контент:

 //Dropdown for "Condition"

  <select 
          class="form-control" 
          data-bind="
                     value: selectedValue
                     options: ruleConditions().options(),
                     optionsText: 'Name', 
                     optionsValue: 'Value',
                     optionsCaption: 'Choose condition'">
  </select>


 //Input text field for "Value"

<input 
      type="text" 
      class="form-control" 
      data-bind="visible: ruleConditions().selectedValue()" />

Контент KnockoutJS:

У меня есть две модели просмотра.

1) FormViewModel

2) TextBoxViewModel

Кроме того, у меня есть один массив, который содержит options для раскрывающегося списка.

И моя реализация выглядит следующим образом:

//Options Available in Array

var RuleConditionArray = {

// Options for "Text Field" under Rules tab

textFieldConditions: ko.observableArray
         (
           [
             { 
               Name: 'is filled out', 
               Value: 'isfilledout', 
               isExpressionValueRequired: false 
             },

             {
               Name: 'contains', 
               Value: 'contains', 
               isExpressionValueRequired: true
             }
           ]
        )
};

//Form View Model
function FormVM() {
    var self = this;

    self.textBoxVM = ko.observable(new TextBoxViewModel(Id,Name));
}

//TextField View Model
function TextBoxViewModel(Id, Name) {
var Txt = this;

Txt.CommonProperties = new CommonViewModel(Id, Name);

// Initialize Rule Conditions from Array.
Txt.ruleConditions = ko.observable(new RuleConditionViewModel(RuleConditionArray.textFieldConditions()));

Txt.selectedItem = ko.observable();

Txt.selectedValue = ko.computed(function () {
    return this.selectedItem() && this.selectedItem().isExpressionValueRequired
}, this);

}

formView = new FormVM();
ko.applyBindings(formView);

Что я получаю:

Из приведенного выше кода я могу заполнить раскрывающийся список значениями.

Что я не получил:

Я не могу show/hide Value ввести текстовое поле для "Правил". Мне нужно получить значение isExpressionValueRequired и показать/скрыть текстовое поле ввода "Value" на основе этого значения.

Я поражен этим. Пожалуйста, помогите мне избавиться от этого.

Редактировать - 1: Моя скрипка:

https://jsfiddle.net/vikash208/z4x5meua/3/