如何解决Angularjs ui-router 嵌套状态仅显示特定结果
我有一个带有嵌套状态的 angularjs 应用程序。 但我不知道如何在嵌套状态下动态显示/隐藏 div...
它的工作原理如下:
在 index.html 上有三个链接:
<a ui-sref="territory({territory: 'amer'})">AMER</a> <a ui-sref="territory({territory: 'emea'})">EMEA</a> <a ui-sref="territory({territory: 'apac'})">APAC</a>
<ui-view></ui-view>
根据点击的内容,将显示国家/地区列表。 这些国家也是由视图“views/countries.html”本身产生的链接 代码:
<h1>This is countries</h1>
<br>
Teritory: {{region}}
<div ng-repeat='country in countries'>
<a ui-sref=".support({country: '{{country}}'})">{{country}}</a ui-sref>
<ui-view></ui-view>
</div>
</div>
这里的 UI-VIEW 是我想在一个国家被点击时使用的东西,它应该显示属于那个国家的人......但只有当那个国家被点击时。
示例:
Sweden
- person A
- person B
Germany
Italy
当例如意大利被点击,瑞典下的人会再次隐藏,意大利下的人会显示。
属于 .support 的控制器应使用工厂服务来检索人员。 但是控制者(我猜)还应负责仅在正确的国家/地区显示人员数据。但这就是我陷入困境的地方。 我很确定我必须将第二个嵌套的 ui-view 放在 div 中并动态切换可见性...
伪代码:
When country-link is clicked
controller reads which country is clicked (by using $stateparams)
get the results from service (parameter country)
return the people
Make the div under the correct country visible
hide the rest
我该如何巧妙地做到这一点,我需要为 div 分配一个 ID 或名称,然后在结果出现时使其可见或隐藏...
当然,一种解决方案是将视图放在国家/地区列表下。那么就没有问题了。但我真的想让他们在他们所属的国家....
ps。现在点击其中一个国家会发生什么:
Teritory: emea
Sweden emeaBelgiumsupporters go here
Poland emeaBelgiumsupporters go here
Italy emeaBelgiumsupporters go here
Malta emeaBelgiumsupporters go here
Netherlands emeaBelgiumsupporters go here
谢谢!
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。