Сохранить клик по методу

Question

Как я могу сохранить выбранные заголовки ng-click в методе в контроллере?

<div ng-click="selectItem(dimension, $event)">
    <span text="{{dimension.title}}" title="{{dimension.title}}">Item 1</span>
</div>
<div ng-click="selectItem(dimension, $event)">
    <span text="{{dimension.title}}" title="{{dimension.title}}">Item 2</span>
</div>
<div ng-click="selectItem(dimension, $event)">
    <span text="{{dimension.title}}" title="{{dimension.title}}">Item 3</span>
</div>

Я редактирую расширение qlik sense и мне нужно сохранить выбранные элементы в приложении.

Answer 1

Лучшей идеей было бы идентифицировать объекты с уникальным идентификатором, а не заголовком, который можно повторить.Если объект dimension имеет идентификатор (или другое уникальное значение), используйте его.

Адаптируйте приведенный ниже код под свои нужды:

var app = angular.module("myModule", []); 
app.controller("myCtrl", function($scope) {
    var vm = this;
    
    vm.dimensions = [
      {
        title: 'Title 1'
      },{
        title: 'Title 2'
      },{
        title: 'Title 3'
      },{
        title: 'Title 4'
      },{
        title: 'Title 5'
      },{
        title: 'Title 6'
      },
    ];
    
    vm.selected = [];
    
    vm.selectItem = function(item, event) {
      if(!vm.isSelected(item)) {
        vm.addItem(item);        
      } else {
        vm.removeItem(item);
      }
      
      // Show selected list
      console.log(vm.selected);
    }
    
    vm.isSelected = function(item) {
      return vm.selected.indexOf(item.title) != -1;
    }
    
    vm.addItem = function(item) {
      vm.selected.push(item.title);
    }
    
    vm.removeItem = function(item) {
      var index = vm.selected.indexOf(item.title);
      vm.selected.splice(index, 1);    
    }
});

.element {

  margin: 20px;
  line-height: 10px;
  border-bottom: 1px solid black;
  cursor: pointer;

}

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.7.5/angular.min.js"></script>
<div ng-app="myModule">
  <div ng-controller="myCtrl as ctrl">
    <div ng-repeat="dimension in ctrl.dimensions" ng-click="ctrl.selectItem(dimension, $event)">
        <span text="{{dimension.title}}" title="{{dimension.title}}" class="element">
          {{ dimension.title }} 
          <span ng-if="ctrl.isSelected(dimension)">- checked</span>
        </span>
    </div>
  </div>
</div>