angular.js - 求一个angularJS写法

Question

A是下拉列表 BC是文本框。
默认C文本框是隐藏。B文本框可用 。
要实现当A下拉选择最后一个元素，B禁用同时C显示。
A不选择最后一个元素，恢复原样。

            <fieldset>
            <legend>Household Income Survey</legend>

            <p class="row">
                <p class="form-group col-xs-12 col-sm-6">
                    <label for="HouseholdSize" class="control-label">I. How many people live in your home?</label>
                    <select class="form-control" name="HouseholdSize" id="HouseholdSize">
                        <option value="1">1</option>
                        <option value="2">2</option>
                        <option value="3">3</option>
                        <option value="4">4</option>
                        <option value="5">5</option>
                        <option value="6">6</option>
                        <option value="7">7</option>
                        <option value="8">8</option>
                        <option value="8+">8+</option>
                    </select>
                </p>
                <p class="form-group col-xs-12 col-sm-6">
                    <label for="HouseholdIncome" class="control-label">II. Household Annual Income</label>
                    <select class="form-control" name="HouseholdIncome" id="HouseholdIncome">
                        <option value=""></option>
                        <option value="15171">15171</option>
                        <option value="21590">21590</option>
                        <option value="29101">29101</option>
                        <option value="36612">36612</option>
                        <option value="44123">44123</option>
                        <option value="51634">51634</option>
                        <option value="59145">59145</option>
                        <option value="66656">66656</option>
                        <option value="74167">74167</option>
                    </select>
                </p>
            </p>

            <p class="form-group hidden" id="HouseholdIncomeGroup">
                <label class="control-label" for="HouseholdIncome">III. If there are more than 8 people living at your
                    home, please write the annual household income here</label>

                <p class="input-group">
                    <p class="input-group-addon">$</p>
                    <input type="text" class="form-control" name="" placeholder="">
                </p>
            </p>
        </fieldset>

Answer 1

htmlコード:

リーリー

JavaScript コード:

リーリー

Answer 2

@nightire と同じアイデアで、コード部分は次のとおりです:

リーリー

たぶんこんな感じです。

Answer 3

<select> 填充好，然后 ng-model 绑定作用域里一个属性，然后 $watch 这个属性，当条件满足时改变一个状态属性（预先定义好），最后将这个状态属性双向绑定给 B 的 ng-disabled 和 C 的 ng-show/ng-if 以上です。