1

在我的 AngularJS 应用程序中，我必须创建一个手风琴，每个部分都包含一个滑块控件。我希望手风琴和滑块都向外部控制器公开 API，例如：

accordion.collapseAll()
accordion.openNextPane()

或者

slider.resetValue()

我希望能够在控制器中做类似的事情：

$scope.clickNext = function() {
    $scope.accordion.openNextPane();
};

$scope.clickResetAll = function() {
    $scope.items.forEach(function(item, ind) {
        $scope.slider[ind].resetValue();
        // or:
        $scope.accordion.pane[ind].slider.resetValue();
    });   
}

我正在考虑为手风琴和滑块创建隔离范围指令，并使用双向绑定允许它们将其方法公开给父控制器。页面模板将如下所示：

<div ng-controller="myController">
    <accordion data="accordion">
        <div ng-repeat="c in collection">
            <accordion-pane>
                <slider data="slider"></slider>
            </accordion-pane> 
        </div>
    </accordion>
</div>

但是在这一点上，我迷失在一个孤立的范围和对孩子的有限可见性的迷宫中，似乎没有办法从外部控制器访问内部元素。我搜索过的许多解决方案似乎认为让指令与控制器对话而不是相反是正常的，但这似乎破坏了封装。

关于如何做到这一点的任何想法？这个问题的正确 AngularJS 模式是什么？

4

0 回答 0