javascript – 在AngularJS中切换动态选择菜单的数据模型

我想要做的是有三种不同的选择这些菜单都将被绑定到相同的数据中.更改第一个选择菜单,将更改菜单2和3的数据.

这是我的控制器的内部：

$scope.data = [
        {
            "id" : "0","site" : "Brands Hatch","buildings" : [
                { "building" : "Building #1" },{ "building" : "Building #2" },{ "building" : "Building #3" }
            ],"floors" : [
                { "floor" : "Floor #1" },{ "floor" : "Floor #2" },{ "floor" : "Floor #3" }
            ]
        },{
            "id" : "1","site" : "Silverstone","buildings" : [
                { "building" : "Building #4" },{ "building" : "Building #5" },{ "building" : "Building #6" }
            ],"floors" : [
                { "floor" : "Floor #4" },{ "floor" : "Floor #5" },{ "floor" : "Floor #6" }
            ]
        }
    ];

这是我迄今为止从参考文献中尝试过的,它使用了我需要的相同想法：http://codepen.io/adnan-i/pen/gLtap

当从第一个选择菜单中选择“品牌填充”或“银石”时,其他两个菜单将会将其数据更改/更新与正确的数据对应.我正在使用$watch来监听从上述CodePen链接中获取的更改.

这是观看脚本(未修改,显然不工作)：

$scope.$watch('selected.id',function(id){
        delete $scope.selected.value;
        angular.forEach($scope.data,function(attr){
            if(attr.id === id){
                $scope.selectedAttr = attr;
            }
        });
    });

据我所知,这会删除当前数据的更改,然后循环遍历$scope.data,如果attr.id与传递给该函数的id匹配,则将数据推回到更新视图的范围.我只是坚持构造这个,并会感谢一些指导和帮助,因为我真的很新的AngularJS.谢谢！

原文地址：https://www.jb51.cc/js/153247.html

版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 [e-mail] 举报，一经查实，本站将立刻删除。

• 上一篇：javascript – ES6导入的定义执行顺下一篇：javascript – 在d3.js中制作一个弧