Question

这是我的问题：

我有一个DIV，你有4个字段：2个下拉菜单和2个输入[text]。

通过对象数组的ng-repeat填充3个字段：

$scope.ddList = [
        {
          code: 1253,
          name: "test13",
          supervisor: "cas3",
          overseer: "cas32",
          kstTextColor: "#000",
          kstBackgroundColor: "#fff"

        }, and so on..

并且最后一个第四个字段有自己的数组，可以重复填充它：

 $scope.ddColor = [
        { backgroundcolor: "rgb(255, 170, 14)",
        textcolor: "#fff"
        },
        {backgroundcolor: "rgb(245, 73, 73)",
        textcolor: "#fff"

        }, and so on...

主要下拉列表，循环显示ddList并显示元素：ddList.name 是问题。

我希望当您从该下拉列表中选择一个元素时，2个输入[文本]字段将由该对象中的其他2个属性ddList.supervisor and ddList.overseer填充。

问题是下拉列表在其模板文件中有ng-repeat，因此2个输入[text]字段不在其中，我不能只调用ng-model="k.supervisor"和ng-model="k.overseer"因为它们超出了范围。

我该如何解决这个问题？那么基于第一个下拉列表中的选择，用相应的对象填充输入[text] .fields？

我遇到的第二个问题是关于带有自己的ng-repeat和数组的第二个下拉菜单我希望当在第一个下拉列表中选择一个元素时，用户可以从第二个下拉列表中选择一个“颜色”，并且颜色属性：ddColor.backgroundcolor和ddColor.textcolor将被复制到主数组中，对于属性：ddList.kstTextColor和ddList.kstBackgroundColor。

我想我可以解决第二个问题，当我有第一个问题的解决方案时，因为它有同样的问题，我无法访问那个ng-repeat的范围，所以我无法调用在循环中运行正确的元素并用新颜色覆盖它们。

这里有一个jsFiddle：

http://jsfiddle.net/xytyg8vc/8/

非常感谢

Answer 1

http://jsfiddle.net/xytyg8vc/9/

更新typeSelection时，传递ng-click表达式中的整个对象：

<li role="menuitem" ng-click="selectType(k)" ng-repeat="k in ddList track by $index"><span>{{k.name}}</span>

这样，在您的控制器中，您可以访问该对象的所有属性：

$scope.selectType = function(item) {
    $scope.typeSelection = item.name;
    $scope.inputs = {
      supervisor: item.supervisor,
      overseer: item.overseer
    };
};

我不确定您为什么使用ddList变量作为输入的ngModel。这是令人困惑的，应该避免。为输入提供单独的唯一变量更有意义：

<input type="text" ng-model="inputs.supervisor">
<input type="text" ng-model="inputs.overseer">

AngularJS问题与下拉菜单和访问ng-repeat之外的元素

1 个答案: