Question

我是棱角分明的新手，为下面寻找一个很好的解决方案但是找不到一个好的选择我有一个由ModalDialogCtrl控制的极端简单的模态对话框，其中包含一个编辑过的对象，例如Rabbit或Dog或Cat或其他任何东西。我希望在用户按下“保存”按钮时允许保存的任何对象具有相同的功能。 Dialog的viewmodel具有正在编辑的对象的嵌套视图，其模板名称将根据编辑对象的类型进行替换。此特定视图包含特定于对象的控制器。

模态控制器：

function ModalDialogCtrl($scope) {
    // $scope.objectSpecificViewModelTemplate = "rabbit.html";
    // or
    // $scope.objectSpecificViewModelTemplate = "dog.html";
    // etc
    ctrl.save = function () {
        // need to call inner object controller's save() method here
    };

    ctrl.cancel = function () {
        // cancel editing
    };
};

模态对话框视图：

<div class="modal-header">
    <!-- Modal header -->
</div>
<div class="modal-body" id="modal-body">
    <!-- Modal body containing object-specific view model -->
    <div ng-include src="objectSpecificViewModelTemplate"></div>
</div>
<div class="modal-footer">
    <!-- Modal buttons -->
    <button class="btn btn-primary" type="button">OK</button>
    <button class="btn btn-warning" type="button">Cancel</button>
</div>

特定于对象的视图模板：

<div ng-controller="RabbitCtrl">
    <p>Weight: <input type="text" ng-model="rabbit.weight" /></p>
</div>

或

<div ng-controller="DogCtrl">
    <p>Color: <input type="text" ng-model="dog.color" /></p>
</div>

特定于对象的控制器：

function RabbitCtrl($scope) {
    $scope.rabbit = { weight: 5}
    $scope.save = function() { /* save to server */ };
}
function DogCtrl($scope) {
    $scope.dog = { dog: "black"}
    $scope.save = function() { /* save to server */ };
}

当用户按下Save按钮时，我需要调用内部对象的save（）方法。我希望将模态控制器和特定于对象的控制器分离，因为我可能希望在应用程序的不同位置重用它们。所以我认为我的问题看起来像：如何使父控制器调用特定的嵌套控制器方法（可以有许多嵌套控制器）或如何使内部控制器调用特定父控制器方法？

Answer 1

我在这里看到了太多方法：

使用活动。
使用require。在子控制器中，您需要父母和电话，即：

parentCtrl.register(childCtrl)

现在在parentCtrl中存储了到child的链接：

vm.register = function(child) {
  vm.containedComponent = child;
}

并且可以调用它的任何方法。（即onSave）

（如果您确定您的父母将始终只有一个孩子，那就不是那么糟糕了，但是如果孩子可能会使用ng更改 - 如果您需要手动取消注册它）

嵌套控制器之间的通信

1 个答案: