如何根据从三个子控制器获得的结果在父控制器中显示动态消息

时间:2016-09-06 20:10:18

标签: javascript angularjs

我有一个div包装其他三个,每个都有自己的控制器。我想根据从每个控制器获得的结果动态显示消息。例如,如果解析的3个数组中有1个长度大于0,我想在警告消息中反映出来。我试图在三个子控制器周围放置一个父控制器,但是我无法从父控制器访问子控制器的范围,这似乎无关。任何帮助将不胜感激。

<div id="pp-summary" ng-controller='PPSummaryCtrl as summCtrl'>
    <div id="pp-stats-summary" ng-controller='PlayerProfileStatsCtrl as s'>     
        <page-section section-title="'Recent Statistics'" excel="{ data:     s.statList, definitions: s.summaryHeaders, name: s.player.fullName + ' -  Summary     Stats' }"    >
            <core-table 
            table-sort
            parent-child-rows
            data="s.statList" 
            footer-data="s.statTotals" 
            columns="s.summaryHeaders">
            </core-table>
        </page-section>
    </div>
    <div ng-controller="PPScoutingCtrl as e">
        <h3 ng-if="!e.permission" id="no-eval-message">
            You do not have permissions to view evals on file for this player.
        </h3>
        <page-section ng-repeat="type in e.evalTypes" section-title="'Recent '+type.description + ' Evals'" ng-if="e.evalsByType[type.evalTypeLk]"
            excel="{data: e.evalsByType[type.evalTypeLk], definitions: e.getColumns(type.evalTypeLk), name: e.player.fullName + ' ' + type.description}"
            >
            <c-table columns="e.getColumns(type.evalTypeLk)" data="e.evalsByType[type.evalTypeLk]" group-rows="true" click-row="e.selectEval" class="table-overflow wrap-last-column"></c-table>
        </page-section>
    </div>
    <div ng-controller="PPNotesCtrl as n">
        <page-section ng-if="n.notes" section-title="'Recent Notes'">
            <c-table data="n.notes" click-row="n.selectNote" highlight="n.highlight" class="table-overflow" columns="n.noteColumns">
            </c-table>
        </page-section>
    </div>
    <h3 id="no-eval-message">
        {{ summCtrl.getWarningMessage() }}
    </h3>
</div>

2 个答案:

答案 0 :(得分:2)

这个问题在这里得到解答和解释.. AngularJS - Access to child scope

短篇小说是你无法做到的。

你可以使用Gustavo建议的发射和广播。

你也可以:

在父级中定义适当的属性,然后在子级中引用它们

将服务用作中间人

答案 1 :(得分:1)

我不知道它是否正确,但你可以使用$ on和$ broadcast。

在父控制器中,您可以输入以下内容:

$rootScope.$on('load-warning', function() {
  $scope.warning-message = "Warning";
});

加载列表后在孩子身上:

$rootScope.$broadcast('load-warning');

再次,非常确定这不是最好的方法,但它能完成这项工作,希望它有所帮助=)