Angular 1.5递归嵌套组件

我正在寻找使用Angular 1.5 Components构建类似于展开折叠的东西。这个想法是你可以连续放置一个或多个，或者你可以嵌套它们来创建一棵树。因此，有效的HTML可能看起来像：Angular 1.5递归嵌套组件

<expand-collapse title="This is my title"> 
    <p>This is my content</p> 
</expand-collapse>

或者

<expand-collapse title="Level 1 Title"> 
    <expand-collapse title="Level 2 Title"> 
     <p>This is my content</p> 
    </expand-collapse> 
</expand-collapse>

所以，我的问题是我是否能与方法相关的角1.5组件（不是指令）做到这一点二级展开崩溃可能意识到它的父级展开崩溃。一般来说，当你喜欢这个巢成分，我认为你会是这样的：

component('expandCollapse', { 
    ... 
    require : { 
     parentCtrl : "^expandCollapse" 
    } 
    ...

但是A）嵌套在此情况下必须的，B）parentCtrl结束是一个永无止境的递归引用当前$ CTRL。

这是可以用组件完成的事情吗？还是因为某种原因被明确禁止？

来源

2016-11-04 LoganBlack

可能您是否在寻找带transclude选项的指令？ – Hoyen

嗯，我特别想用组件做，而不是指令。我正在使用transclude，但这并不能解决我希望的方式。 – LoganBlack

我只看到两个办法：

定义要求precendent级每一级指令，这可能会导致不必要的代码。
搜索使用角功能：element.parent().controller('expand-collapse');。这种方法通常不被推荐，但我没有看到比这更简单/更清洁的东西。

来源

2016-11-04 15:43:39 Walfrat

感谢您的回复。＃1会将我限制在X层，我想不惜一切代价避免这些X层。＃2是我所有想到的，但我希望有更清洁的东西。 – LoganBlack

@LoganBlack用户界面人机工程学规则可能会规定，可能在5层甚至3层的情况下，你做错了。 – Walfrat

是的，但仍然不是我想要施加的限制。 – LoganBlack

Angular 1.5递归嵌套组件

回答

相关问题