我正在尝试创建导航标签(取自Twitter Bootstrap):
<ul class="nav nav-tabs">
<li class="active"><a href="#">Home</a></li>
<li><a href="#">Profile</a></li>
<li><a href="#">Messages</a></li>
</ul>
Run Code Online (Sandbox Code Playgroud)
活动选项卡标有class="active"
.
http://jsfiddle.net/schawaska/pfbva/上有静态导航栏和路由器/插座功能的很好的例子,但我无法理解如何创建动态导航栏/菜单/选项卡视图.
据我了解,可以在每个菜单项中使用类绑定:
classNameBindings: ['isActive:active']
Run Code Online (Sandbox Code Playgroud)
但是在哪里切换isActive属性的正确位置?
什么是"正确的方式"(或者至少是选项,如果没有单一的"Ember方式"这样做)导航侧边栏?我应该以某种方式查看ContainerViews,还是应该使用新的插座功能并将导航粘贴到我的应用程序视图中?
另外,根据URL(我正在使用路由)在li上设置.active类的"正确方法"是什么?对此有什么帮助吗?
看起来如果你想使用新的Ember.js路由器和插座来动画状态之间的转换,你就不走运了,因为在你有机会为它设置动画之前,插座的先前内容将被销毁.如果您可以在转换到新状态之前完全为一个视图设置动画,则没有问题.只有在需要显示旧视图和新视图时才会出现问题.
看起来在此提交中添加了以前插件内容和新内容动画所需的一些功能,但我不确定我是否理解如何使用它.
还有一些讨论使用额外的过渡路线/状态来明确地模拟动画可以表示的"中间"状态(此处和此处),但我不确定目前是否可以将此方法与出口控制器相匹配和意见.
这类似于在Ember.js中退出路径时如何*不*销毁View,但我不确定覆盖outlet
帮助器是一个很好的解决方案.
有任何想法吗?
我在运行下面的代码时得到了这个断言:
不允许在inBuffer状态下清空视图,在正常情况下不应该这样做.很可能您的应用程序中存在错误.这可能是由于过多的财产变更通知.
链接到演示:http: //plnkr.co/edit/s3bUw4JFrJvsL690QUMi
var App = Ember.Application.create({
Store: DS.Store.extend({
revision: 4,
adapter: DS.FixtureAdapter.create()
}),
Router: Ember.Router.extend({
root: Ember.Route.extend({
index: Ember.Route.extend({
route: "/",
connectOutlets: function(router){
var person;
person = App.Person.find(657);
person.addObserver("isLoaded", function() {
return router.get('router.applicationController').connectOutlet("things", person.get("things"));
});
}
})
})
}),
ApplicationController: Em.Controller.extend(),
ApplicationView: Em.View.extend({
template: Em.Handlebars.compile("{{outlet}}")
}),
ThingsController: Em.ArrayController.extend({
thingTypes: (function() {
return App.ThingType.find();
}).property()
}),
ThingsView: Em.View.extend({
template: Em.Handlebars.compile([
'{{#each controller.thingTypes}}',
'{{this.name}}',
'{{/each}}',
'{{#each controller.content}}',
'{{this.title}}',
'{{/each}}'].join(""))
}),
//MODELS
Person: DS.Model.extend({
things: DS.hasMany('App.Thing', {
embedded: true …
Run Code Online (Sandbox Code Playgroud) 我正在试图弄清楚如何使用我的应用程序处理无效路由Ember.Router
.
目前,如果我输入无效路线,例如myapp.com/#FooBarDoesntExist,它将重定向到索引路线('/').我想要它,如果我可以定义一个notFound或404状态,它将路由到所以我可以通知用户发生了什么.而不是他们被倾倒在主页上.
关于新的Ember.js路由系统(在此描述),如果我理解正确,当您退出路由时视图将被销毁.
有没有办法在退出路径时绕过视图的销毁,以便在用户重新进入路径时保留视图的状态?
更新:看起来,除非在新路线中更换插座视图,否则不会销毁视图.例如,如果您在某个{{outlet master}}中使用ViewA的stateA,并且您使用{{outlet master}}中的ViewB转到stateB,则ViewB将取代ViewA.解决这个问题的方法是在需要保留视图时定义多个出口,例如{{outlet master1}},{{outlet master2}},...
一个很好的功能是能够将一组视图传递到插座.并且还可以选择在退出路线时是否会销毁视图或隐藏视图.
我有一个动作:
{{action create target="controller"}}
Run Code Online (Sandbox Code Playgroud)
我已将其定位到绑定控制器(而不是路由器),如下所示:
App.AddBoardController = Ember.Controller.extend
create: ->
App.store.createRecord App.Board, {title: @get "boardName"}
App.store.commit()
//TODO: Redirect to route
Run Code Online (Sandbox Code Playgroud)
如何从控制器操作重定向回路由?
我正在试图弄清楚如何防止或暂停路线改变.对于我的编辑屏幕,如果用户在未保存的更改时导航(后退按钮或其他某种机制),我想提示他们确保他们想要离开页面.非常相似window.onbeforeunload
,但通过路由器.
以前版本的Ember中的状态图为您提供了一个可以使用的过渡对象.似乎在ember-latest中,情况已不再如此.那么最好的方法是什么呢?
编辑:
上述问题陈旧,所列答案已过时.Ember现在有一种本地方式来处理这个问题.请参阅文档:http://emberjs.com/guides/routing/preventing-and-retrying-transitions/
我正在尝试将一些东西与ember + emberdata + router + asp.net web api放在一起.大多数它似乎工作,但我陷入了一个错误消息,当ember-data尝试findAll
通过适配器为我的模型时我得到.
在我的后端,我有一个这样的模型(C#):
public class Genre {
[Key]
public int Id { get; set; }
[Required]
[StringLength(50, MinimumLength=3)]
public string Name { get; set; }
}
Run Code Online (Sandbox Code Playgroud)
在我的应用程序中,我使用ember-data代表它:
App.Genre = DS.Model.extend({
id: DS.attr("number"),
name: DS.attr("string")
}).reopenClass({
url: 'api/genre'
});
Run Code Online (Sandbox Code Playgroud)
我在我的应用程序中使用RESTAdapter定义了一个Store,如下所示:
App.store = DS.Store.create({
revision: 4,
adapter: DS.RESTAdapter.create({
bulkCommit: false
})
});
Run Code Online (Sandbox Code Playgroud)
商店在我的控制器中使用如下:
App.GenreController = Ember.ArrayController.extend({
content: App.store.findAll(App.Genre),
selectedGenre: null
});
Run Code Online (Sandbox Code Playgroud)
路由器定义为
App.router = Em.Router.create({
enableLogging: true,
location: 'hash',
root: Ember.Route.extend({
//...
genre: …
Run Code Online (Sandbox Code Playgroud) javascript ember.js asp.net-web-api ember-data ember-old-router
有没有办法在Ember.js路由器中进行条件重定向,而不会破坏路由器的内部一致性?