Question

我有一个navbar组件，我已放在application.hbs中，因此它应该始终可见。但我想用我访问的每个页面更改导航栏的标题（比如我在索引页面上应该说＆＃34; Home＆＃34;，如果我在个人资料页面上，它应该说个人资料等。）现在正在发生的事情是导航栏标题始终保持＆＃34; Home＆＃34;对于所有页面。这种情况正在发生，因为导航栏在浏览器中加载页面时会被渲染为onlu，之后它不会根据页面进行更改。

application.hbs

{{top-navbar dp_url=model.profile.dp_url first_name=model.profile.first_name title=title}}

{{outlet}}

这里我根据用户的页面计算标题的值。

的application.js（控制器）

if (currentPage === "" || currentPage === "#"){
      currentState.set('title',"Home")
 }
else if(currentPage === "Userprofile"){
      console.log('myStudio');
      currentState.set('title',"UserProfile");
}

在这里，currentpage有app的当前网址，我正在比较它并决定导航栏的标题值。

但是，只有当用户在浏览器中加载应用时才会计算顶部导航栏标题值，而不是在我将f从一个路径移动到另一个路径时。

我也尝试过Ember.Evented但无法解决问题。

Answer 1

我不知道您使用的是Ember.js和Ember数据版本，currentState是deprecated since 2.1，无论如何看起来您正在使用针对Ember的私有方法内部，并不打算在应用程序中使用。

实现目标的可能（但可能是不必要的复杂）方法是：

使用您想在导航栏中变异的信息创建一个模型（例如navbar-data）。
在呈现导航栏的路线中，使用固定的数字ID（例如store.createRecord('navbar-data', { id: 1, title: "index" })）为其创建并返回记录。
将创建的记录传递给组件（而不仅仅是字符串）。
每当您想要更改时，请使用store.peekRecord('navbar-data', 1)查看记录，并在导航栏中更改要更改的值。

当然，您使用的记录必须不与record.save()一起保存。

无法在导航器中使导航栏项动态化

1 个答案: