Error: [$parse:syntax] Syntax Error: Token '{' is an unexpected token

Error: [$parse:syntax] Syntax Error: Token '{' is an unexpected token

我不太擅长 AngularJS 所以也许这个问题很容易解决,但我找不到解决方案,这让我发疯。

我必须将项目中的 AngularJS 版本从 1.2.28 更新到 1.3.15,然后开始显示错误。现在我的导航栏在移动模式下无法正常工作。

错误是Error: [$parse:syntax] Syntax Error: Token '{' is an unexpected token at column 18 of the expression [expander.submenu_{{ $index }}.toggle()] starting at [{{ $index }}.toggle()].

如何解决?

有问题的文件是:

ul.show-on-large(data-context-menubar)
    li(gp-aria-role="menuitem" role="menuitem")
        a.nav-primary-item(title='Home',ui-sref-opts="{location: false}",  ui-sref='subscription.location.home' ng-click="expander.collapse(); menu.cancel();") Home
    li(ng-repeat='folder in rootFolders track by folder.Id' ng-class="{'megamenu-hover': hover==folder.Id}" ng-mouseenter="menu.show(folder.Id)" ng-mouseleave="menu.cancel()")
        .nav-primary-item(ng-if="folder.hasChildren" gp-aria-role="menuitem" role="menuitem" aria-haspopup="true" aria-owns="submenu_{{ $index }}" ng-click="expander.submenu_{{ $index }}.toggle()")
            | {{ folder.Name }}
            i.icon-down-open
        a.nav-primary-item(ng-if="!folder.hasChildren" ui-sref-opts="{location: false}" ui-sref="subscription.location.folder({ type: 'folder', locationId: '{{ folder.Id }}' })" gp-aria-role="menuitem" role="menuitem")
            | {{ folder.Name }}
        .panel.megamenu(ng-if="folder.hasChildren" id="submenu_{{$index}}" gp-aria-role="menu" role="menu" ng-show="hover==folder.Id || expander.submenu_{{ $index }}.state")
            .step3.large_3.show-on-large(ng-if="folder.Featured.length > 0" ng-repeat='item in folder.Featured track by item.Id')
                a.panel.megamenu-featured(ui-sref-opts="{location: false}", title="Link to {{item.title}}" ui-sref="subscription.location.content({ type: '{{item.Type}}', locationId: '{{ item.Id }}' })" gp-aria-role="menuitem" role="menuitem" ng-click="expander.collapse(); menu.cancel();")
                    img(ng-src='{{ imageSrc(item.ImageId) }}', alt='Feature thumbnail' class="megamenu-thumb")
                    b.epsilon.uppercase.primary-color Featured Article
                    p {{ item.Name }}
            .large_3(ng-repeat='column in folder.Columns track by $index')
                ul.nav-megamenu-secondary(data-context-submenu)
                    li(ng-repeat='subFolder in column track by subFolder.Id')
                        a(gp-aria-role="menuitem" role="menuitem" ui-sref-opts="{location: false}", ui-sref="subscription.location.folder({ type: 'folder', locationId: '{{ subFolder.Id }}' })" ng-click="expander.collapse(); menu.cancel();")
                            | {{ subFolder.Name }}

在JavaScript中,可以使用方括号交替访问对象的属性。试试这个:

ng-click="expander['submenu_' + $index ].toggle()"