ng-if 不适用于选择 ngmodel 值

Question

我正在研究 ionic 项目。我正在尝试显示一些有关选项选择的数据。我编写代码的方式是，当用户选择所有 3 个选择选项时，必须出现一个带有一些数据的表单。我已将 ngmodel 用于 3 个选择选项，在选择第 3 个选择选项后，应该会出现表单，因为我在 ng-if 中使用了第 3 个选择选项 ng-model 作为 div 标签。但它不起作用。下面是我的代码：

<div class="row form-group" ng-controller="myProfileCtrl">
                <div class="col-md-3 col-sm-4 col-xs-6 margin1">
                    <select class="form-control" ng-change="loadtypes()" ng-model="selectedIndustry" ng-options="industry for industry in name">
                        <option value="">Select Industry</option>
                    </select>
                </div>
                <div class="col-md-3 col-sm-4 col-xs-6 margin1">
                    <select class="form-control" ng-change="loadProducts()" ng-model="selectedtype" ng-options="make_year.make_year for make_year in makeYear">
                        <option value="">Select Type</option>
                    </select>
                </div>
                <div class="col-md-3 col-sm-4 col-xs-6 margin1">
                    <select class="form-control" ng-change="loadServices()" ng-model="selectedProduct" ng-options="car_model.car_model for car_model in carModel">
                        <option value="">Select Product</option>
                    </select>
                </div>
            </div>
            <!--Table or div-->
            
            <div ng-if="selectedProduct">
                <form class="form-group">
                    <div class="row">
                        <div class="col col-33">
                            <b>Service Issue</b>
                        </div>
                        <div class="col col-33">
                            <b> Tick</b>
                        </div>
                        <div class="col col-33">
                            <b> Cost</b>
                        </div>
                    </div>
                    <div class="row" ng-repeat="services in serviceData" style="margin-bottom:5px;">
                        <div class="col col-33">
                            <label>{{services.services}}</label>
                        </div>
                        <div class="col col-33">
                            <input type="checkbox" value="" ng-model="checks[$index]" />
                        </div>
                        <div class="col col-33">
                            <input class="form-control" type="text" style="width:100px;" ng-model="inputs[$index]" />
                        </div>
                    </div>
                    <div class="row">
                        <div class="col col-50">
                            <b>Service Request</b>
                        </div>
                        <div class="col col-50">
                            <b> Tick</b>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col col-50">
                            <label>First Response</label>
                        </div>
                        <div class="col col-50">
                            <input type="checkbox" ng-model="ser.firstResponse" />
                        </div>
                    </div>
                    <div class="row">
                        <div class="col col-50">
                            <b>Location</b>
                        </div>
                        <div class="col col-50">
                            <input class="form-control" list="places" name="location" ng-model="ser.location" />
                            <datalist id="places">
                                <option value="Kochi-Kerala">
                                    <option value="Pune-Maharastra">
                                        <option value="Bangalore-Karnataka">
                                            <option value="Hyderabad-Telangana">
                            </datalist>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col col-50">
                            <b>Resolution Time</b>
                        </div>
                        <div class="col col-50">
                            <input type="number" class="form-control" min="1" ng-model="ser.resolution" />

                        </div>
                    </div>
                    <div class="row">
                        <div class="col col-50">
                            <b>Prioritized preferred partners</b>
                        </div>
                        <div class="col col-50">
                            <input type="checkbox" ng-model="ser.partners" />
                        </div>
                    </div>

                </form>
                <button type="button" class="btn btn-primary" ng-click="add()">Save</button>

            </div>

angularjs中选择选项后如何在表单中显示数据？

Answer 1

你会写 carModel 的值吗，因为我用我的值测试你的代码并且它OK，看看html：

<select class="form-control" ng-change="loadServices()" ng-model="selectedProduct" ng-options="item.label for item in items">
    <option value="">Select Product</option>
</select>
<div ng-if="selectedProduct">
    mozhdeh
</div>

和控制器：

    $scope.items = [{
    id: 1,
    label: 'aLabel',
    subItem: { name: 'aSubItem' }
}, {
    id: 2,
    label: 'bLabel',
    subItem: { name: 'bSubItem' }
}];