<tbody class="table-hover">
         <tr ng-repeat="(id,local) in $ctrl.locals  | orderBy:sortType:sortReverse | filter: $ctrl.name | filter:$ctrl.address">
            <td>{{local.name}}</td>
            <td>{{local.address}}</td>
            <td>{{local.phone}}</td>
            <td>
                <button ng-click="$ctrl.editShop(id)" class="button expand success">Edit</button>
            </td>
        </tr>
    </tbody>

angular.module('app')
    .component('articleComponent', {
        bindings: {
            name: '<',
            address: '<'
        },
        templateUrl : 'app/articles/articles.html',
        controller : function(deliveryService, $location, $scope){

            this.locals = deliveryService.getDetailLocals()

            this.sortType= 'name';
            this.sortReverse = true;

            this.editShop = function(id){
                $location.path("/edit/" + id)
            }
        }
    })

<form>
  <fieldset>
    <legend>{{ textButton }}</legend>

    <div class="row">
      <div class="large-12 columns">
        <label>name</label>
        <input type="text" placeholder="name" ng-model="local.name" required>
      </div>
    </div>

    <div class="row">
      <div class="large-4 columns">
        <label>Adress</label>
        <input type="text" placeholder="Edad" ng-model="local.adress" required>
      </div>
    </div>
    <button type="submit" class="button large-12">{{ textButton }}</button>
  </fieldset>
</form>

angular
.module('app')
.component('editComponent', {
    bindings: {},
    templateUrl: 'app/edit/edit.html',
    controller: function ($scope, $routeParams) {
        $scope.textButton = "Edit user";
        console.log($scope.local) // --> undefined
        console.log($routeParams) // --> {id:'0'}
    }
})