Question

我的一个模板显示了一些引导标签：

{{view Bootstrap.Tabs
    contentBinding="controller.content"
    selectionBinding="controller.selection"}}

使用以下模型：

SettingsApp.ProfileRoute = Ember.Route.extend({
    model: function () {
        var model = Ember.A([
            Ember.Object.create({title:t('profile.user'),      link:'#/profile/user'}),
            Ember.Object.create({title:t('profile.company'),   link:'#/profile/company'}),
            Ember.Object.create({title:t('profile.product'),   link:'#/profile/products/index'}),
        ]);
        return model;
    },
});

这很好用：显示标签并且链接正常工作。单击选项卡时，将激活相应的路径，但 Bootstrap.Tabs视图未突出显示所选选项。所有选项均显示为无效。

在我的（复杂）应用程序中，我正在执行与此jsbin相同的操作，但jsbin正在按预期工作：选中时选项卡显示为活动状态。

我的申请可能出现什么问题？有关这种奇怪现象的任何调试建议吗？

Answer 1

要深入了解Ember.LinkView的内部工作原理，这是为{{#linkTo}}帮助器实例化的视图，您可以观察它的active属性并检查它是否也被更改了你的（复杂的）应用程序。

Ember.LinkView.reopen({
  activeChanged: function() {
    console.log('active');
  }.observes('active')
});

我已将此添加到您的jsbin demo，并且它显然正常工作。

希望有所帮助

Bootstrap.Tabs视图不会将选定的选项卡显示为活动状态

1 个答案: