@westdp

Как скопировать элемент по клику на Angular?

Ребята привет, подскажите начал изучать angular и решил сразу практиковать его, выбрал сделать на подобии калькулятора калорий
Подскажите как мне сделать чтобы при клике на элемент c фильтром(левая колонка), он копировался в правую колонку
Рабочий пример: angular.andriyboyko.com
function SearchCtrl($scope, $filter)
{
    $scope.items = [
        {kkal:405, name:'Apple'},
        {kkal:195, name:'Orange'},
        {kkal:105, name:'Banana'},
        {kkal:155, name:'Cherry'},
        {kkal:65, name:'Melon'},
        {kkal:125, name:'Kiwi'},
        {kkal:80, name:'Lime'},
        {kkal:140, name:'Lemon'},
        {kkal:120, name:'Mango'},
        {kkal:40, name:'Olive'},
        {kkal:210, name:'Plum'},
        {kkal:310, name:'Ebony'},
        {kkal:50, name:'Pineapple'}];
    
    $scope.items2 = $scope.items;
    
    $scope.$watch('search', function(val)
    { 
        $scope.items = $filter('filter')($scope.items2, val);
    });
};


Спасибо за любую помощь.
  • Вопрос задан
  • 296 просмотров
Решения вопроса 2
Fesor
@Fesor
Full-stack developer (Symfony, Angular)
1) по ngClick вызываем какой-то метод контроллера
2) в методе контроллера меняем состояние (айтем из одного массива перекидываем в другой или копируем или что вам там надо сделать).
3) вьюшка волшебным образом перестраивается сама по изменению состояния данных, слава декларативности!

Короч суть в том, что в ангуляре вы должны мыслить данными и управлением состоянием вашего приложения. А "элементы" - вы просто в шаблонах декларативно опиываете как должен реагировать UI на изменения. Например ngRepeat описывает как выводить айтем коллекции, это не тоже самое что цикл.
Ответ написан
@PerfectLab
Что можно сделать вашим примером:
В ng-click можно передавать текущий элемент ng-click="CopySearchItem(item)". В методе CopySearchItem можно как угодно обрабатывать элемент, в том число скопировать в другой массив с даными:
$scope.newArray = [];
    $scope.CopySearchItem = function(item) {
        var newItem = angular.copy(item);
        $scope.newArray.push(newItem);     
    }

Данные из $scope.newArray выводим в правой колонке.
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы
23 янв. 2022, в 15:41
10000 руб./за проект
23 янв. 2022, в 15:22
2000 руб./за проект
23 янв. 2022, в 13:48
80000 руб./за проект