How can I make a ng-click outside of an ng-repeat call the ng-repeat data?

Question

I have a ng-repeat put in 3 seperate places on the web page. I want to put ng-clicks to reference those 3 individually from points outside the ng-repeat.

Sort of like so:

<div ng-repeat="x in data.y" ng-if="x.data.type == 'type1'">
DATA PULLED FROM DB, DISPLAYED IN A LIST
</div>
<div ng-repeat="x in data.y" ng-if="x.data.type == 'type2'">
DATA PULLED FROM DB, DISPLAYED IN A LIST
</div>

And then, outside of those places. I have

<button ng-click"delete_thing(x)">

And another elsewhere.

<button ng-click"delete_thing(x)">

I used to, when having them inside of those ng-repeats have no problem. They would delete the list item that I wanted them too without an issue. Now, they don't delete at all. I recognize that I can't just tell it to know what thing to delete. How do I specify?

Javascript is below:

    $scope.delete_thing = function (x) {
                            var id = x.id;
                            $.ajax({
                                type: "POST",
                                url: "/dashboard/profile/delete/x/" + id + "/",
                                data: {'csrfmiddlewaretoken': getCookie('csrftoken')},
                                success: function () {
                                    console.log('sent and ok');
                                }
                            })
                        };

Answer 1

If I understand what you are trying to do, is encapsulating the deletion method and reuse it in different places in your application.
With that in mind, as indicated on the comment, the key thing is to decide and aggregate which item(s) is selected.
There are many simple ways to solve it, but I think you can benefit from creating a generic solution as the following is.
Regardless which selection element you choose (checkbox, radio, custom, etc), I would introduce two directives:
The first one simply toggles item selection and push or pulls the items from its container:

app.directive('selectableItem', function() {
    return {
        restrict: 'A',
        require: '^selectionContainer'
        link: function (scope, element, attrs, selectionContainerCtrl) {
            // Everyitem selection toggler (checkbox, radio, custom) should attach its selection function to toggleSelection method.
            scope.toggleSelection = function(item) {
                if (item.isSelected) {
                    selectionContainerCtrl.add(item);
                } else {
                    selectionContainerCtrl.add(remove);
                }
            }
        }
   }
})

The second one is the actual container that aggregates the items within the container:

app.directive('selectionContainer', function() {
        return {
            restrict: 'A',
            controller: function ($scope) {
                $scope.items = [];
                this.add = function(item) {
                    $scope.items.push(item);
                }

                this.remove = function(item) {
                    $scope.items.splice($scope.items.indexOf(item), 1);
                }
            },
            link: function (scope, element, attrs) {
                scope.delete_things = function () {
                                // iterate through items and delete them:
                                angular.forEach($scope.items, function(item) {
                                     $.ajax({
                                        type: "POST",
                                        url: "/dashboard/profile/delete/x/" + item.id + "/",
                                        data: {'csrfmiddlewaretoken': getCookie('csrftoken')},
                                        success: function () {
                                            console.log('sent and ok');
                                        }
                                    })
                                })

                            };
            }
       }
    })

And now all you have to do is call the toggleSelection on an item when it is selected or deselected, and add your delete button:

<div selection-container>
    <div ng-repeat="x in data.y" ng-if="x.data.type == 'type1'">
        DATA PULLED FROM DB, DISPLAYED IN A LIST
    </div>
    <button ng-click"delete_things()"></button>
</div>

The key thing to realize here is that the "selectableItem" requires the "selectionContainer" and therefore it will introduce a new container whenever being used and the items will not be mixed out together.

P.S. This solution enables deletion of multiple items. If you are using list (with only one item selected at a time) it will work as well.

/EDIT/
Here is a complete working example. Depend on your actual element of choice, you should modify the selection toggle.