How to mount an ng-repeat using "track by"?

Question

I have the following HTML

<div class="col-md-4">
    <div class="exibeUnidades">
        <table width="400">
            <thead>
                <tr>
                    <td width="100"><b>Profissionais</b></td>
                </tr>
            </thead>
            <tbody>
                <tr ng-repeat="pro in profissionais track by name">
                    <td width="100"><a href="#agendaProfissional/{{pro.idprofissional}}">{{pro.nome}}</a></td>
                    <td width="160">{{pro.funcao}}</td>
                    <td width="160">{{pro.unidade}}</td>
                </tr>
            </tbody>
        </table>
    </div>
</div>

'Cause I’m doing the following consultation at the bank:

<?php
$idestabel = $_GET['idestabel'];

    $getPro=$pdo->prepare("SELECT * FROM unidade INNER JOIN profissional 
                          ON profissional.idunidade = unidade.idunidade WHERE idestabelecimento=:idestabel");
    $getPro=bindValue(":idestabel", $idestabel);
    $getPro->execute();

    while ($linhaPro=$getPro->fetch(PDO::FETCH_ASSOC)) {

        $idunidade = $linhaPro['idunidade'];
        $unidade = $linhaPro['unidade'];
        $idprofissional = $linhaPro['idprofissional'];
        $idunidade = $linhaPro['idunidade'];
        $nome = $linhaPro['nome'];
        $funcao = $linhaPro['funcao'];

        $return[] = array(
            'idprofissional'    => $idprofissional,
            'nome'  => $nome,
            'funcao'    => $funcao,
            'unidade'   => $unidade
        );


    }
?>

My controller:

app.controller("ProfissionaisCtrl", ['$scope', '$http', '$window', '$location', '$rootScope', function ($scope, $http, $window, $location, $rootScope) {

$rootScope.idestabelecimento = localStorage.getItem('idestabelecimento');

var getPro = function(){
    var idestabel = $rootScope.idestabelecimento;
    var opcao = 3 // Buscar profissionais
    $http.get("http://reservacomdomanda.com/areaAdmin/api/admin_estabelecimento/profissionais.php?opcao="+opcao+"&idestabel="+idestabel).success(function(response){
        $scope.profissionais = response;
    })
}

getPro();

}]);

To return this to me:

And this is the message that appears on the console:

angular.js:12477 Error: [ngRepeat:dupes] Duplicates in a Repeater are not allowed. Use 'track by' Expression to specify Unique Keys. Repeater: pro in profissionais track by name, Duplicate key: Undefined, Duplicate value: b

Return from console.log(Sponse) att:Sorack

Answer 1

ngRepeat - Error - dupes

Duplicates in a repeater are not allowed. Use 'track by' expression to specify unique keys. Repeater: {0}, Duplicate key: {1}, Duplicate value: {2}

Occurs if there are Duplicate Keys in an ngRepeat Expression. Duplicate Keys are banned because AngularJS use Keys to Associate DOM nodes with items

In free translation:

Duplicados na repetição não são permitidos. Use a expressão 'track by' para especificar chaves únicas. Repetidos: {0}, Chave duplicada: {1}, Valor Duplicado: {2}

Occurs if there are duplicate keys in the expression ngRepeat. Duplicate keys are banned because the AngularJS uses keys to associate nodes from DOM with the items.

Your attribute name does not exist in the object, so it is going over and over again as undefined. You may not use an attribute that can be repeated on track by. You can use another field as below:

<tr ng-repeat="pro in profissionais track by pro.idprofissional">

Or use the $index:

<tr ng-repeat="pro in profissionais track by $index">

Or, if you guarantee that the professional name will not repeat itself:

<tr ng-repeat="pro in profissionais track by pro.nome">

Recalling that the track by serves to improve performance when traversing objects in the DOM.