Javascript 角度foreach-空值

我遇到一个问题，当我尝试选择多个设备并将它们添加到组中时，所选设备的数组（$scope.deviceid.push）无法获取值。有人能看到这个问题或提出不同的方法吗。我将其用作我构建的服务的模板

这是角度代码

 var MyApp = angular.module('MyApp', ['ui.bootstrap', 'angularjs-dropdown-multiselect']);
MyApp.controller('GroupsController', ['GroupsService', '$scope', '$log', '$uibModal',
function (GroupsService, $scope, $log, $uibModal) {
    $scope.groupSelected = [];
    $scope.location = '';
    $scope.groupguid = '';
    $scope.newGroupName = '';
    $scope.devicesNotinGroup = [];
    $scope.newGroupAddMember = 'false';
    $scope.isCollapsed = false;
    $scope.groupSelected.GroupID = 0;
    $scope.SelectedDevices = [];
    $scope.deviceIDs = [];
    $scope.dropdownSetting = {
        scrollableHeight: '200px',
        scrollable: true,
        enableSearch: true
    }

    // Populate Jobs
    GroupsService.GetDeviceList().then(function (d) {
        $scope.GroupList = d.data;
        console.log(d.data)
    }, function (error) {
        alert('Error!');
    });

    $scope.showChilds = function (item) {
        $scope.grouplist = [];

        item.active = !item.active;
        console.log("here item=" + item.GroupName + " active=" + item.GroupName.active);
        grouplist = item.SubGroup;

    };
    $scope.showInfoForGroup = function (item) {
        console.log("item = " + item + "Count = " + item.DeviceCount);
        GroupsService.GetGroupDeviceInformation(item).then(function (d) {
            $scope.groupSelected = d.data.devicegroupitem;
            //$scope.devicesNotinGroup = d.data.devicesnotingroup;
            angular.forEach(d.data.devicesnotingroup, function (value, index) {

            $scope.devicesNotinGroup.push({ label: value.HostName, id: value.HostName  });

            });
            //console.log($scope.devicesNotinGroup)
        })

    }, function (error) {
        console.log("item = " +item + "Count = " + groupSelected.DeviceCount);
    };
    $scope.DeleteDeviceFromGroup = function (deviceguid, groupguid ) {
        console.log("DeviceGuid = " + deviceguid + " GroupGuid = " + groupguid);
        GroupsService.DeleteDeviceFromList(deviceguid, groupguid).then(function (d) {
            $scope.groupSelected = d.data;
        })
    }
    $scope.AddDeviceToGroup = function (hostname, groupguid) {
        GroupsService.AddDeviceToGroup(hostname, groupguid).then(function (d) {
            $scope.showInfoForGroup(dt.guid);
            //$scope.groupSelected = d.data.devicegroupitem;
            //$scope.devicesNotinGroup = d.data.devicesnotingroup;
            $scope.newGroupAddMember = 'false';
        })
    }
    $scope.SubmitMultipleDevices = function (groupguid){
        $scope.deviceIDs = [];
        console.log($scope.SelectedDevices);
        angular.forEach($scope.SelectedDevices = function (value) {
            $scope.deviceIDs.push({ dname: value.HostName, dguid: groupguid } );
        });


        console.log('device ids ');
        console.log($scope.deviceIDs);
        var data = { deviceIDs: deviceIDs };
        console.log(data);
        angular.toJson(data);
        GroupsService.SubmitMultiDevicesToGroup(data)
                      .success(function () {

                      })
      .error(function (error) {

      });

    }


    $scope.CreateGroup = function (groupID, groupName, newGroupAddMember) {
        angular.isUndefinedOrNull = function (groupID) {
            return angular.isUndefined(groupID) || groupID === null
        }
        $scope.GroupList = '';
        console.log("check value equals" + groupID)
        GroupsService.CreateSubGroup(groupID, groupName, newGroupAddMember).then(function (d) {
            $scope.GroupList = d.data;
            $scope.newGroupName = '';
            $scope.newGroupAddMember = false;
        })
    }
    $scope.DeleteGroup = function (groupID) {
        $scope.GroupList = '';
        GroupsService.DeleteSubGroup(groupID).then(function (d){
        $scope.GroupList = d.data;
        $scope.newGroupName = '';
        })

    }
}])

MyApp.factory('GroupsService', function ($http) { // explained about factory in Part2
var fac = {};
fac.GetDeviceList = function () {
    return $http.get('/DeviceGroups/getgrouptree')
}
fac.GetGroupDeviceInformation = function (guid) {
    return $http.get('/DeviceGroups/GetGroupDeviceInfo?groupguid=' + guid)
}
fac.DeleteDeviceFromList = function (deviceguid, groupguid) {
    return $http.get('/DeviceGroups/DeleteDeviceFromGroup?deviceguid='+ deviceguid + "&groupguid=" + groupguid)
}
fac.AddDeviceToGroup = function (hostname, groupguid) {
    return $http.get('/DeviceGroups/AddDeviceToGroup?hostname=' + hostname + "&groupguid=" + groupguid)
}
fac.CreateSubGroup = function (groupID, groupName, newGroupAddMember) {
    return $http.get('/DeviceGroups/CreateGroup?GroupID=' + groupID + "&groupName=" + groupName + "&AddMember=" + newGroupAddMember)
}
fac.DeleteSubGroup = function (groupID) {
    return $http.get('/DeviceGroups/DeleteGroup?GroupID=' + groupID)
}
fac.SubmitMultiDevicesToGroup = function (data) {
    return $http.post('/DeviceGroups/AddMultipleDevicesToGroup', data)
}
return fac;
});

以下是查看代码：

@model List<NetworkCafe.Models.DeviceGroup>

@{
ViewBag.Title = "Groups";
}
<style>
#clickable:hover {
    cursor: pointer;
}
.body-content{padding-top:50px}
.checkbox{padding:0;margin:0;}
.dropdown-menu{overflow:auto !important;}
.form-group div{display:inline-block; margin-right:10px}
</style>
<link rel="stylesheet" href="../Content/font-awesome.min.css">
<div class="container" style="width:90%" ng-app="MyApp" ng-controller="GroupsController">
<div class="col-lg-3">
    <div ng-class="dropdown" class="panel panel-warning">
        <div class="panel-heading">
            Tree List of Groups
        </div>
        <div class="panel-body">
            <script type="text/ng-template" id="tree-structure">
                <span>
                    <span id="clickable" ng-class="{'glyphicon glyphicon-chevron-up':(!dt.AddMembers) && (!dt.active), 'glyphicon glyphicon-chevron-down':(!dt.AddMembers) && (dt.active),  'childElement':(dt.AddMembers)}" ng-click="showChilds(dt)"></span>
                    <span id="clickable" ng-click="showInfoForGroup(dt.guid)"> {{dt.GroupName}} </span>
                </span>

                <ul ng-if="dt.AddMembers">
                    @*<li>Device Count: {{dt.DeviceCount}}</li>
                        <li>Total Ports: {{dt.TotalPortCount}}</li>
                        <li>Open Ports: {{dt.OpenPortCount}}</li>
                        <li>Reserved Ports: {{dt.ReservedPortCount}}</li>
                        <li>Percent Used: {{dt.PercentUsed}}</li>*@
                    @*<li><button ng-click="href"</li>*@
                </ul>
                <ul style="list-style: none" ng-show="dt.active" class="childElement">
                    <li ng-repeat="dt in dt.SubGroup" ng-include="'tree-structure'">

                    </li>
                </ul>

            </script>
        </div>
        <ul style="list-style: none" ng-class="list-group-item" class="parentList">
            <li ng-repeat="dt in GroupList" ng-include="'tree-structure'" style="list-style: none">

            </li>
        </ul>
    </div>
</div>
<div class="col-lg-3">
    <div class="panel panel-info">
        <div class="panel-heading">
            <h3 class="panel-title">Group {{groupSelected.GroupName}} Information</h3>
        </div>
        <div class="panel-body">
            <span ng-hide="!groupSelected.AddMembers">
                This group has devices and can not have subgroups.
            </span>
            <table class="table table-striped table-hover" ng-hide="!groupSelected.AddMembers">
                <tr>
                    <td>Device Count: </td>
                    <td></td>
                    <td>{{groupSelected.DeviceCount}}</td>
                </tr>
                <tr>
                    <td>Total Ports: </td>
                    <td></td>
                    <td>{{groupSelected.TotalPortCount}}</td>
                </tr>
                <tr>
                    <td>Open Ports: </td>
                    <td></td>
                    <td>{{groupSelected.OpenPortCount}}</td>
                </tr>
                <tr>
                    <td>Reserved Ports: </td>
                    <td></td>
                    <td>{{groupSelected.ReservedPortCount}}</td>
                </tr>
                <tr>
                    <td>Percent Used:</td>
                    <td></td>
                    <td>{{groupSelected.PercentUsed}}</td>
                </tr>
            </table>

            <span ng-hide="groupSelected.AddMembers">
                This group has subgroups and can not have members.<br /><br />
                <label>CREATE SUBGROUP</label><br />
                <input ng-model="newGroupName" placeholder="Group Name" /><br />
                <label>Group Type</label><br />
                <input type="checkbox" ng-model="newGroupAddMember" ng-checked="!newGroupAddMember" />Group will be used for Device.<br />
                <button type="submit" class="btn btn-success" ng-click="CreateGroup(groupSelected.GroupID, newGroupName, newGroupAddMember)">Submit</button><br />----------------------- <br />
            </span>
            <span>
                <a class="btn btn-danger" ng-click="DeleteGroup(groupSelected.GroupID)">Danger Delete Group </a> <br />
                Delete Group. This will delete all subgroups and devices under this group.
            </span>

        </div>
    </div>
</div>
<div class="col-lg-6" ng-hide="!groupSelected.AddMembers">
    <div class="panel panel-success">
        <div class="panel-heading">
            <h3 class="panel-title">Device List</h3>
        </div>
        <div class="panel-body">
            <table class="table table-striped table-hover ">
                <tr>
                    <th></th>
                    <th>Device Name</th>
                    <th>Total Ports</th>
                    <th>Open Ports</th>
                    <th>Reserved Ports</th>
                    <th>Percent Used</th>
                </tr>
                <tr ng-repeat="dl in groupSelected.DeviceList">

                    <td> <i id="clickable" class="fa fa-times" ng-click="DeleteDeviceFromGroup(dl.guid, groupSelected.guid)"></i> &nbsp;</td>
                    <td>{{dl.DeviceName}}</td>
                    <td>{{dl.TotalPortCount}}</td>
                    <td>{{dl.OpenPortCount}}</td>
                    <td>{{dl.ReservedPortCount}}</td>
                    <td>{{dl.PercentUsed}}</td>
                </tr>
                <tr>
                    <td></td>
                </tr>

            </table>
            @*<ul class="nav navbar-nav">
                <li class="dropdown">
                    <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">----------Add Device from Switch List----------<span class="caret"></span></a>
                    <ul class="dropdown-menu" role="menu">
                        <li ng-repeat="sl in devicesNotinGroup">
                            <span>
                                <i id="clickable" class="fa fa-plus-square" ng-click="AddDeviceToGroup(sl.HostName, groupSelected.guid)"></i> &nbsp; {{sl.HostName}} &nbsp; {{sl.Site}} &nbsp; {{sl.Zone}}
                            </span>
                        </li>
                    </ul>
                </li>
            </ul>*@
            <form class="form-inline" name="myForm" role="form" ng-submit="SubmitMultipleDevices(groupSelected.guid)">
                <div class="form-group">
                    <label>Add Devices to Group: </label>
                    @* Directive *@
                    <div ng-dropdown-multiselect="" extra-settings="dropdownSetting" options="devicesNotinGroup" selected-model="SelectedDevices" checkboxes="true"></div>
                </div>
                <br />
                <button type="submit" class="btn btn-primary">Submit</button>
            </form>
        </div>
    </div>
</div>
</div>

@section scripts{
<script src="~/Scripts/angular-1.4.9/ui-bootstrap-tpls-1.1.2.min.js"></script>
<script src="~/Scripts/AngularControllers/DeviceGroupsV2.js"></script>
<script src="~/Scripts/angular-1.4.9/angularjs-dropdown-multiselect.min.js"></script>
<script src="~/Scripts/angular-1.4.9/lodash.js"></script>
}

@型号列表
@{
ViewBag.Title=“组”；
}
#可点击：悬停{
光标：指针；
}
.body内容{padding top:50px}
.checkbox{填充：0；边距：0；}
.下拉菜单{溢出：自动！重要；}
.form组div{显示：内联块；右边距：10px}
组的树列表
{{dt.GroupName}

@*
设备计数：{{dt.DeviceCount}
端口总数：{dt.TotalPortCount}
打开的端口：{dt.OpenPortCount}
保留端口：{dt.ReservedPortCount}
使用百分比：{dt.PercentUsed}}
*@
@*
您的forEach循环不正确

angular.forEach($scope.SelectedDevices = function (value) {
            $scope.deviceIDs.push({ dname: value.HostName, dguid: groupguid } );
        });

应该是：

angular.forEach($scope.SelectedDevices, function (value) {
            $scope.deviceIDs.push({ dname: value.HostName, dguid: value.groupguid } );
        });

您的forEach循环不正确

angular.forEach($scope.SelectedDevices = function (value) {
            $scope.deviceIDs.push({ dname: value.HostName, dguid: groupguid } );
        });

应该是：

angular.forEach($scope.SelectedDevices, function (value) {
            $scope.deviceIDs.push({ dname: value.HostName, dguid: value.groupguid } );
        });

您能同时显示视图代码吗？听起来这可能是模型的一个问题，只是要澄清一下，console.log（$scope.deviceid）的输出；是空的。我不明白为什么没有数据，因为我正在将所选设备推入该阵列。但是console.log（$scope.SelectedDevices）；只显示我选择的项目。您能同时显示视图代码吗？听起来这可能是模型的一个问题，只是要澄清一下，console.log（$scope.deviceid）的输出；是空的。我不明白为什么没有数据，因为我正在将所选设备推入该阵列。但是console.log（$scope.SelectedDevices）；只显示我选择的项目。哇，谢谢。我在上面撞了几个小时，没问题！很高兴就这些was@JeremyHobbs你能把答案标记为正确吗？哇，谢谢。我在上面撞了几个小时，没问题！很高兴就这些was@JeremyHobbs你能把答案标为正确吗？