ng-options внутри ng-repeat, удаляя уже выбранные значения параметров - PullRequest
Новая
       2

ng-options внутри ng-repeat, удаляя уже выбранные значения параметров

0 голосов
/ 26 февраля 2019

Простая проблема, но я не уверен, как ее решить.

У меня есть ng-repeat, который динамически создает поля выбора с ng-параметрами того же значения

У меня есть ng-повторите эту итерационную опцию модели. 

<div data-ng-repeat="condition in model.conditions">
    <label>{{condition}}</label>
    <select data-ng-model="selectedValue"
            ng-options="item.name for item in optionList">
    </select>
</div>

это модель условия: 

$scope.model = 
    {
        conditions:
        [
            {id:1,name:"CONDITION_ONE"},
            {id:2,name:"CONDITION_TWO"}
        ]
    }

это элемент optionList: 

$scope.optionList = 
    [
        {id:1, name:"OPTION_ONE"},
        {id:2, name:"OPTION_TWO"},
        {id:3, name:"OPTION_Three"}
    ];

Просто иллюстративное изображение:

enter image description here

То, что я пытаюсь сделать, это при выборе элемента в поле выбора сверху, я быхотел бы удалить этот элемент из поля выбора снизу и, таким образом, предотвращая дублирование элементов путем удаления уже выбранных элементов .

Есть ли способ сделать это с помощью angularJS?

1 Ответ

0 голосов
/ 26 февраля 2019

Использовать фильтр в ng-repeat 

<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
<body>

<div ng-app="myApp" ng-controller="myCtrl">
<div data-ng-repeat="condition in model.conditions">
    <label>Remove Id {{condition.id}} from  List </label>
<select ng-model="selectedName" ng-options="item.name for item in filter(condition)">
</select>

</div></div>

<script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
    $scope.optionList = 
    [
        {id:1, name:"OPTION_ONE"},
        {id:2, name:"OPTION_TWO"},
        {id:3, name:"OPTION_Three"}
    ];
    
    $scope.model = 
    {
        videos:
        [
            {id:1,name:"CONDITION_ONE"},
            {id:2,name:"CONDITION_TWO"}
        ],
        conditions : [
        {id:1, name:"OPTION_ONE"},
        {id:2, name:"OPTION_TWO"},
        {id:3, name:"OPTION_Three"}
    ]
    };
    
    $scope.filter = (item)=>{
   		return $scope.optionList.filter(list => list.id !== item.id);
    }
});
</script>

</body>
</html>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...