从另一个Angular控制器更新ng-repeat

时间:2016-02-25 15:26:35

标签: javascript html angularjs

我默认加载来自 Clash of Clans API的列表,该列表返回JSON响应。我的第一个控制器(func makeIncrementer() -> (Int ->Int) { func addOne(number:Int) ->Int { return 1 + number } return addOne // result`enter code here`:Int -> Int } var increment = makeIncrementer() // result:`enter code here`Int -> Int increment(7) // result`enter code here`8 )里面的一切都很顺利。

然后,我添加了一个表单来搜索一个部落的ID(MainCtrl)。

我可以获取表单传递的值,但现在我正在尝试更新SearchCtrlng-repeat指令member in memberList内的列表。

我多次搜索我的问题,但没有找到解决方案。我不想要 使用MainCtrl。我确信还有另一种不那么脏的方式来达到我的目的。

这是我的HTML和Angular代码

HTML:

$rootScope

AngularJS:

<form class="uk-form" name="searchClanform" ng-controller="SearchCtrl" novalidate>              
  <input type="text" name="idCLan" class="uk-form-width-medium"
    placeholder="Eg. PP8JC9RQ"
    ng-model="searchClanform.idClan"
    ng-pattern="/([A-Za-z0-9]){1,8}/"
    required>
  <button href="#" class="uk-button uk-button-primary"
    ng-disabled="searchClanform.$invalid"
    ng-click="getClanFromForm()">Rechercher <i class="uk-icon-search"></i></button>
</form>
<section class="uk-container uk-container-center" ng-controller="MainCtrl">
  <table class="uk-table uk-table-condensed uk-table-striped uk-table-hover">
    <tr ng-repeat="member in memberList">
      <td>
        {{member.name}}
      </td>
      <td>
        {{member.league.name | LeagueEnToFr}}
      </td>
      <td>
        {{member.expLevel}}
      </td>
      <td>
        {{member.trophies}}
      </td>
    </tr>
  </table>
</section>

希望我的问题清楚, 问候。

1 个答案:

答案 0 :(得分:0)

通常,Angular会让观察者在更新范围后自动触发摘要周期。这是角度双向数据绑定的基础。

我不清楚你的问题究竟是什么,但这里有什么可以帮助你:

一旦$ scope.memberList值发生更改,UI就会更新。如果它没有更新。您始终可以调用$ scope.apply()来手动触发摘要循环。

我认为您要做的是再次搜索新ID。所以我想你想要的代码应该是这样的代码:

CocAppServices.getAllMembers(clanId,function(data) {
$scope.$parent.memberList = data;
        });

这当然假设你将searchCtrl设置为mainCtrl的子节点,这应该是这样的操作的情况。

甚至更简单。摆脱你的搜索控制器并将getClanFromForm函数放在mainCtrl