Question

我们正在构建一个大型SPA，目前该应用程序是使用widgets/components构建的。每个都有一个模板，控制器。但许多可以嵌套在同一条路线上。例如：在路线/users/中，我可以使用`userCtrl和userTemplate来呈现用户统计信息部分。一个graphCtrl和一个graphTemplate来渲染一些d3图表。一个listCtrl和一个listTemplate来呈现一个列表。所有这些小部件都应该是可重用的（具有不同的css和布局，有时在其他页面中使用相同的ctrl不同的模板）。我需要从服务实例化一些数据 - 让我们说一个返回我的用户ID和更多验证的服务。所以在主应用程序路由中，我为resolve{myId: function(srvname){return srvname.myId}}路由定义userCtrl when路由routeProvider路由到{。}}。

我的问题是listCtrl不等待userCtrl（获取路由的main页面ctrl）来解析不同的承诺，然后失败并丢失数据。

有没有办法为多个控制器定义相同的解析，其中一些不是直接路由目标，而是更多（非常）大组件？是否有更好/更聪明的方法来做到这一点？

我知道我可以使用指令。但是将业务逻辑从listCtrl转移到指令看起来是错误的。

我很乐意提供任何帮助和建议

Answer 1

控制器之间通信的标准建议是使用服务。如果我正确地阅读您的描述，那么在您的情况下，顶级控制器将负责设置模型并在服务中将其设置为“后代”控制器以进行读取。

@ alonisser的评论

编辑：

您应该能够将依赖控制器的视图数据绑定到依赖$ scope上的函数（比如说viewData()，这样如果函数返回null，则隐藏元素或显示“微调器” “用户界面。

依赖模板看起来像：

...
<div data-ng-if="viewData() !== null">
    <!-- show display elements based on the return value from viewData() -->
</div>
...

viewData的设置如下所示：

...
$scope.viewData = function() {
    if ($scope.model.asyncData === null) {
        $log.info("no data yet!");
        return null;
    }
    else
        return prepare_for_view($scope.model.asyncData);
}
...

userCtrl中的异步调用类似于：

something_that_returns_a_promise.then(function (result) {
    $scope.model.asyncData = result;
});

关键是something_that_returns_a_promise()必须是AngularJS调用堆栈“内部”的东西，例如使用$http完成。在这种情况下，Angular会自动调用$scope.$apply()，您的相关显示元素应该无缝更新。否则，您需要在设置$scope.$apply()的异步回调中自己调用$scope.model.asyncData。

Angular - 在同一视图/路径/页面中解析多个控制器

1 个答案: