ng-if不使用select ngmodel值

时间:2017-10-08 08:16:27

标签: javascript angular ionic-framework

我正在研究离子项目。在这里我试图显示一些关于选项选择的数据。我编写了代码,当用户选择所有3个选择选项时,表格必须出现一些数据.I已经选择了3个选择选项的ngmodel,在选择了第3个选择选项之后,应该出现表格,因为我在div-tag的ng-if中使用了第3个选择选项ng-model。但是它不起作用。以下是我的代码:



<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>
&#13;
&#13;
&#13;

如何在选择angularjs中的选项后显示表格中的数据?

1 个答案:

答案 0 :(得分:0)

你会写carModel的值,因为我用我的值测试你的代码并且没问题,看看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' }
}];