Проблема AngularJS с выпадающим меню и доступом к элементам вне ng-repeat - PullRequest
Новая
       6

Проблема AngularJS с выпадающим меню и доступом к элементам вне ng-repeat

0 голосов
/ 08 мая 2018

это моя проблема:

У меня есть DIV, где у вас есть 4 поля: 2 раскрывающихся списка и 2 ввода [текст].

3 поля заполняются ng-повторить массив объектов: 

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

        }, and so on..

, а последнее 4-е поле имеет свой собственный массив, который повторяется для его заполнения: 

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

        }, and so on...

Основной выпадающий список, который зацикливается на ddList и показывает элемент: ddList.name - это проблема.

Я хочу, чтобы при выборе элемента из этого раскрывающегося списка 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/

Большое спасибо

1 Ответ

0 голосов
/ 08 мая 2018

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">
...