Question

我有以下最小的应用程序。

主容器有一个指向＆＃34; Todos＆＃34;的链接。当我点击＆＃34; Todos＆＃34;链接获取类active并按照相应的css规则变为红色。当我在浏览器中提交#/todos网址时，会使用＆＃34; Todos＆＃34;加载正确的模板。标有班次active的链接。

嵌套对象链接出现问题。

当我关注特定待办事项的链接时，它会呈现todo模板并将链接标记为红色。但是当我在浏览器中提交#/todos/1个网址时，它会使用正确的模型回复正确的模型（它会显示ID），但链接没有类active。

所以我的问题是，通过在浏览器中提交网址#/todos/1，相应链接无法获得课程active。

JSBin：http://jsbin.com/vopajaro/1#/todos/2

的index.html

<!DOCTYPE html>
<html>
    <head>
        <script src="http://code.jquery.com/jquery-2.0.0.js"></script>
        <script src="http://builds.handlebarsjs.com.s3.amazonaws.com/handlebars-1.0.0.js"></script>
        <script src="http://builds.emberjs.com/tags/v1.3.0/ember.js"></script>

        <script src="app.js"></script>

        <link rel="stylesheet" href="app.css"/>
    </head>
    <body>
        <script type="text/x-handlebars" data-template-name="application">
            {{#link-to "todos"}}Todos{{/link-to}}
            {{outlet}}
        </script>

        <script type="text/x-handlebars" data-template-name="todos">
            {{#each}}
                {{#link-to "todo" this}}{{id}}{{/link-to}}
            {{/each}}
            {{outlet}}
        </script>

        <script type="text/x-handlebars" data-template-name="todo">
            {{id}}
        </script>
    </body>
</html>

app.js

var App = Ember.Application.create();

App.Router.map(function() {
  this.resource('todos', function() {
    this.resource('todo', { path: ":id" });
  });
});

App.TodosRoute = Ember.Route.extend({
  model: function() {
    return [{id: 1, name: 'todo 1'}, {id: 2, name: 'todo 2'}];
  }
});

app.css

a.active {
  color: red;
}

Ember.js当前链接未标记为＆＃34;活动＆＃34;当通过浏览器直接访问url访问时

0 个答案: