Angularjs下拉框联动(1)

时间:2022-07-23
本文章向大家介绍Angularjs下拉框联动(1),主要内容包括其使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。

第一种联动方式,在网上看到的,感觉对于我的使用性不高,比较后端不会提供这种json。。。

实现截图

html

    <select ng-model="s1" ng-options="selectData.name for selectData in selectDatas">
        <option value="">--产品类目--</option>
    </select>
    <select ng-model="s2" ng-options="util.name for util in s1.utils">
        <option value="">--产品类型--</option>
    </select>

js

     $scope.selectDatas = [{
                code: 01,
                name: "监控安全类",
                utils: [
                    { code: 0101, name: "遥控门锁" },
                    { code: 0102, name: "声光报警器" },
                    { code: 0103, name: "摄像头" }
                ]
            },
            {
                code: 02,
                name: "大家电",
                utils: [
                    { code: 0201, name: "空调" },
                    { code: 0202, name: "洗衣机" },
                    { code: 0203, name: "洗碗机" }
                ]
            }
        ]