Ember Uncaught RangeError:超出最大调用堆栈大小

时间:2013-04-26 18:30:35

标签: ember.js coffeescript

我正在尝试构建一个简单的CRUD,例如适用于单个模型的EmberJS应用程序。

我的路线目前看起来像这样:

Blog.ApplicationRoute = Ember.Route.extend()

Blog.Router.map ->
  @route 'about'
  @resource 'posts', ->
    @route 'new'
    @resource 'post', { path: '/:post_id' }, ->
      @route 'edit'

Blog.PostsRoute = Ember.Route.extend
  model: -> Blog.Post.find()

Blog.PostsNewRoute = Ember.Route.extend
  model: -> Blog.Post.createRecord()
  events:
    save: ->
      console.log @
      @.get('currentModel').get('store').commit()
      @.transitionTo('posts')


Blog.PostEditRoute = Ember.Route.extend
  model: -> @modelFor('post')
  events:
    update: ->
      @.get('currentModel').get('store').commit()
      @.transitionTo('posts')

我的HTML视图包含一些简单的把手模板:

%script#about{type: "text/x-handlebars"}
  %h2 About...

%script#posts{type: "text/x-handlebars"}
  .row-fluid
    .span4
      %h4 Posts
      %ul
      = hb 'each model' do
        %li
          = hb 'linkTo "post" this' do
            = hb 'title'

      = hb 'linkTo "posts.new"' do
        New Post
    .span8
      = hb 'outlet'

%script#post{type: "text/x-handlebars"}
  %h2= hb 'title'
  = hb 'body'
  %p
    = hb 'linkTo "post.edit" this' do
      Edit
  = hb 'outlet'

%script{id: 'posts/new', type: "text/x-handlebars"}
  %h2 New Post
  %p
    = hb 'view Ember.TextField', valueBinding: 'title'
  %p
    = hb 'view Ember.TextArea', valueBinding: 'body'
  %p
    %button{hb: 'action "save"'}Save


%script{id: 'post/edit', type: "text/x-handlebars"}
  %h2 Edit Post
  %p
    = hb 'view Ember.TextField', valueBinding: 'title'
  %p
    = hb 'view Ember.TextArea', valueBinding: 'body'
  %p
    %button{hb: 'action "update"'}Save

索引列表,新表单和展示模板按预期工作。单击“编辑”按钮后,我在Javascript控制台中收到以下错误:

Uncaught RangeError: Maximum call stack size exceeded

我可以直接通过浏览器的位置栏访问编辑路线,没有任何问题:

/#/posts/1/edit

当前的布局结构会将编辑模板呈现在show模板的正下方,对应于我正在使用的嵌套路径。

堆栈跟踪看起来像这样:

contentPropertyDidChange
sendEvent
Ember.notifyObservers
propertyDidChange
ChainNodePrototype.chainDidChange
ChainNodePrototype.chainDidChange
ChainNodePrototype.didChange
chainsDidChange
propertyDidChange
contentPropertyDidChange
sendEvent

我很无能为什么只需点击编辑按钮即可触发contentPropertyDidChange事件。

1 个答案:

答案 0 :(得分:1)

我在ember.js: stack overflow with a route

中找到了答案

诀窍是使用model代替this来构建修改路线:

%script#post{type: "text/x-handlebars"}
  %h2= hb 'title'
  = hb 'body'
  %p
    = hb 'linkTo "post.edit" model' do
      Edit
  = hb 'outlet'