2015-10-24 3 views
0

Есть ли способ повторно заполнить мой table ниже, когда select является changed?Пытается заново заполнить таблицу при выборе смены

Я не уверен, как они могут взаимодействовать, даже если они оба живут под тем же ng-app.

<div class="inner" ng-app="fixturesApp"> 
    <h1 class="center">Upcoming matches</h1> 

    <div ng-controller="leagueController"> 
     <form> 
      <label>Choose league:</label> 
      <select id="mySelect" ng-options="option.name for option in data.availableOptions track by option.id" ng-model="data.selectedOption"></select> 
     </form> 
    </div> 
    <div class="row"> 
     <div ng-controller="tableController"> 
      <table class="table"> 
       <thead> 
        <tr> 
         <th>Home</th> 
         <th>Away</th> 
        </tr> 
       </thead> 
       <tbody> 
        <tr ng-repeat="fixture in fixtures"> 
         <td ng-cloak>{{ fixture.homeTeam.name }}</td> 
         <td ng-cloak>{{ fixture.awayTeam.name }}</td> 
        </tr> 
       </tbody> 
      </table> 
     </div> 
    </div> 
</div> 

Вот моя логика. Какие заполнит выбрать с 4 options и устанавливает значение по умолчанию ..

var app = angular.module('fixturesApp', []); 

app.controller('tableController', function ($scope, $http) { 
    $http.get("/fixtures?league=premier").success(function (response) { 
     $scope.fixtures = response; 
    }); 
}); 

app.controller('leagueController', ['$scope', function($scope) { 
    $scope.data = { 
    availableOptions: [ 
     {id: '1', name: 'premier'}, 
     {id: '2', name: 'championship'}, 
     {id: '3', name: 'league1'}, 
     {id: '4', name: 'league2'} 
    ], 
    selectedOption: {id: '1', name: 'premier'} //This sets the default value to premiership 
    }; 
}]); 

ответ

0

Добавить ng-change в списке выбора лиги, то есть:

ng-change="getFixtures(data.selectedOption)" 

Вы должны переместить вызов службы в leagueController :

leagueController:

$scope.getFixtures = function (league) { 
    // set $scope.fixtures 
}; 

В качестве tableController является дочерним лицом , приспособления унаследованы. Если у вас нет другой логики внутри tableController, рассмотрите возможность ее удаления.

Редактировать: Не заметил tableController не ребенок, а родной брат. Имеет смысл иметь диспетчер, ответственный за раскрывающийся список и таблицу, т. Е. Перемещать на один уровень вверх, но если ваш вопрос заключается в том, как уведомить об этом управляющий контроллер, вы можете это сделать, отправив событие от родителя scope, обычно от rootScope.

+0

'tableController' не является дочерью' leagueController'. его объявлено в следующем 'div' – bobbyrne01

+0

справа. Не можете ли вы продвинуть leagueController, чтобы он был родителем таблицы? –