AngularJS – ng-repeat doesn’t use filtered Array, only after second click

I have a button that will print a table:


basically this button is repeated on every row of the table, and each row is an Employee.

So when clicking it, I pass the employee ID to a function, and that function will filter my employeeList to only have the selected employee.

Then I have in my html a second table which loops over the FilteredArray, and it has some specific CSS settings, this table only shows on Print (using media query Print), while the first table only shows in the View.¨

the function I call on the ng-click looks like:

employeeToFilterForPrint(id?: number) {
            this.employeeFiltered = _.cloneDeep(this.employeeList);

            if(id) {
                this.employeeFiltered = this.employeeList.filter(p => == id);

so this.employeeList is the array of employees that I use on the first table (the one shown only in the view),

meanwhile this.employeeFiltered is the array I use for the second table, which is shown only when printing

what happens is, when I click the first time on a employee row, the Browser print window comes out, but the table is full with all the employees.
Then if I close it and click again, now the print table is correctly filtered!

So why the ng-repeat doesnt take the updated table on the first click but only on the second?

Do I need to do something with a Watcher? and how that would look like?

Thank you

Source: AngularJS