javascript - 循环构建菜单链接时检查状态

我正在尝试使用以下数组创建导航链接：

JS：

$scope.sidebarLinks = [
    {
        name: 'Dashboard',
        state: 'dashboard',

    },
    {
        name: 'Students',
        state: 'student.list'
    },
    {
        name: 'Organization',
        children: [
            {
                name: 'School Profile',
                state: 'schoolProfile.detail',
            },
        ],
    },
]

HTML：

<ul>
  <li ui-sref-active="active" ng-repeat="x in sidebarLinks">
    <a ui-sref="{{x.state}}"></a>
  </li>
</ul>

由于“组织”的状态未定义，因此ui-sref为空。
所以有一个错误的说法：


  错误：状态参考无效”


我在以下答案中找到了一些破解方法：

How to achieve that "ui-sref" be conditionally executed?

是否有某种（黑客）方式可以解决此问题而无需为此创建新功能或控制器？

最佳答案

如果您不希望使用其他功能，则可以使用ng-if来提供带有ui-sref的链接（如果已设置状态），而没有状态的链接则未定义。

或者，如果未使用{{x.state || myOtherState }}定义状态，则可以默认为其他状态

当您的组织中有孩子时，我想如果您希望显示孩子，那么ng-if变体最适合您，因为这需要其他HTML。

关于javascript - 循环构建菜单链接时检查状态，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/39164105/