使用动态选择的选项删除无效、空的和未触及的类

Question

我有这个代码：

.HTML：

                <div class="row">
                    <div class="col-md-6">
                        <md-input-container>
                            <label>Country</label>
                            <md-select required ng-model="model.userCountry" id="res_country" name="res_country" ng-change="updateTimeZone(model.userCountry)" aria-label="select">
                                <md-option ng-repeat="country in country" value="{{country.gid}}"> {{country.name}} </md-option>
                            </md-select>
                        </md-input-container>
                    </div>
                    <div class="col-md-6">
                        <md-input-container id="timezone">
                            <label>Timezone</label>
                            <md-select required ng-model="model.userZone" id="res_zone" name="res_zone" aria-label="select">
                                <md-option ng-repeat="zone in zone" value="{{zone.gid}}"> {{zone.name}} </md-option>
                            </md-select>
                        </md-input-container>
                    </div>
                </div>

在我的控制器功能中，我根据所选国家/地区获取时区列表。当我选择一个国家/地区时，如果只有 1 个时区，则默认情况下会选择它。

我的问题是，当我使用以前保存的国家/地区和时区加载视图时，时区选择具有 ng 空和 ng 无效类，如果我再次选择相同的选项，它会被标记为错误。另一种情况是，当我选择一个具有 2 个或更多时区的国家/地区，然后选择另一个只有 1 个时区的国家/地区时。时区将被选中，但也标记为错误。如何删除这些类？

Answer 1

我只是更改了所需的道具并添加了这个：

ng-required="!model.userZone"

这样，仅当没有选定值时，输入才会被标记为错误