Question

我正在使用Asp.MVC 5作为应用程序，我想生成许多具有不同angularjs模型的复选框，我认为最好的选择是在angularjs中使用数组模型。我在foreach：

中尝试了以下代码

   @{
        int i = 0;
        foreach (var selectedVesselViewModel in Model.SelectedVesselViewModels)
        {
            using (Html.BeginForm("SelectNotificaiton", "Admin", new { area = "DashBoard" }, FormMethod.Post, new { id = "filterVesselsForm_" + i}))
            {
                @Html.HiddenFor(item => selectedVesselViewModel.VesselId, new {ng_model= "SelectedVessels[" + i + "].VesselId" })
                <li class="row">
                    <div class="col-md-10">
                        <a href="#" class="text-admin-area">
                            @selectedVesselViewModel.VesselName
                        </a>
                    </div>
                    <div class="col-md-2">        
                        <div class="pull-right">
                            <div class="checkbox checkbox-inline">
                                @Html.CheckBoxFor(item => selectedVesselViewModel.Selected,
                               new {id = "SelectedVesselViewModels_"+i+"__Selected",
                                   onchange ="document.getElementById('filterVesselsForm_"+i+"').submit()",
                                   ng_model = "SelectedVessels[" + i + "].Selected"
                               })
                                <label for="SelectedVesselViewModels_@(i++)__Selected"></label>
                            </div>
                        </div>
                    </div>
                </li>
            }
        }
    }

i变量是一个递增变量：

在angularjs控制器中我有类似这样的东西：

(function (app) {
"use strict";
app.controller("DashboardCtrl", ['$scope',
    function ($scope) {
        function init() {
          // $scope.SelectedVessels = [];
        }

        $scope.SelectedVessels = [];
        init();
        $scope.RefreshSideBarVessels = function() {
            angular.forEach($scope.SelectedVessels, function (value, key) {
                alert($scope.SelectedVessels[key].VesselId);
            });
        }
    }]);
 })(adminModule);

当我使用angularjs foreach循环时，$scope.SelectedVessels似乎是空的，但我不知道为什么！

 angular.forEach($scope.SelectedVessels, function (value, key) {
         alert($scope.SelectedVessels[key].Selected);
 });

有人知道问题出在哪里，为什么我无法访问$scope.SelectedVessels数组的内部属性以及它为什么是空的？

Answer 1

如何为数组添加值，即。 $ scope.SelectedVessels非常重要请看下面的例子。

var values = {name: 'Raja', gender: 'male'};
var log = [];
angular.forEach(values, function(value, key) {
this.push(key + ': ' + value);
}, log);
expect(log).toEqual(['name: Raja', 'gender: male']);

Answer 2

首先，它的ng-model不是ng_model（ - vs _）但可能是拼写错误。其次，试试这段代码

$scope.onChange = function (index, value) {
      $scope.SelectedVessels[index] = value;
}
@Html.CheckBoxFor(item => selectedVesselViewModel.Selected,
SelectedVessels[i] = selectedVesselViewModel.Selected
       new {id = "SelectedVesselViewModels_"+i+"__Selected",
           onchange ="document.getElementById('filterVesselsForm_"+i+"').submit()",
           ng-model = "SelectedVessels[" + i + "].Selected", 
           on-change="onChange(i,selectedVesselViewModel.Selected)
       })

Answer 3

以下是此问题的解决方案：我必须对每个复选框使用zip来实例化ng-model。

ng-init

使用asp.mvc在angularjs中使用数组模型的复选框

3 个答案: