Ember 1.0 RC6 라우터 정보 이해

다음 코드는 RC4에서 제대로 작동하지만 RC6에서는 작동하지 않습니다. index.html#/users/1/edit은 사용자 항목을 편집하기위한 양식을 채우지 않습니다. 누가 새로운 라우터로이 작업을 수행하기 위해 내가 무엇을 바꾸어야하는지 말해 줄 수 있습니까?Ember 1.0 RC6 라우터 정보 이해

는

App = Ember.Application.create(); 

App.Router.map(function() { 
    this.resource('users', function() { 
    this.resource('user', { path: ':user_id' }, function() { 
     this.route('edit'); 
    }); 
    }) 
}); 

App.UsersRoute = Ember.Route.extend({ 
    model: function() { 
    return App.User.find(); 
    } 
}); 

App.UserController = Ember.ObjectController.extend(); 

App.UserEditRoute = Ember.Route.extend({ 
    model: function() { 
    return this.modelFor("user") 
    }, 

    renderTemplate: function() { 
    this.render({ into: 'users' }); 
    }, 

    setupController: function(controller, model) { 
    if (model.get('isNew') == false) { 
     var map = this.map || Ember.Map.create(); 
     this.map = map; 
     var transaction = this.get('store').transaction(); 
     if (map.get(model)) { 
     transaction = map.get(model); 
     } else { 
     map.set(model, transaction); 
     transaction.add(model); 
     } 
    } 
    }, 

    events: { 
    commitThis: function(model) { 
     var map = this.map; 
     var transaction = map.get(model); 
     transaction.commit(); 
     map.remove(model); 
     App.Router.router.transitionTo('users.index') 
    }, 
    rollbackThis: function(model) { 
     var map = this.map; 
     var transaction = map.get(model); 
     transaction.rollback(); 
     transaction.add(model); 
     App.Router.router.transitionTo('users.index') 
    } 
    } 
}); 

App.UserEditController = Ember.ObjectController.extend({ 
    save: function(model) { 
    this.send('commitThis', model) 
    }, 

    undo: function(model) { 
    this.send('rollbackThis', model) 
    } 
}); 

App.Store = DS.Store.extend({ 
    adapter: 'DS.FixtureAdapter' 
}); 

App.User = DS.Model.extend({ 
    firstName: DS.attr('string'), 
    lastName: DS.attr('string') 
}); 

App.User.FIXTURES = [{ 
    id: 1, 
    firstName: "Yehuda", 
    lastName: "Katz" 
}, { 
    id: 2, 
    firstName: "Tom", 
    lastName: "Dale" 
}]

index.html을 App.UserEditRoute.setupController이 _super를 호출하지 않기 때문에 이것이 확신

<!DOCTYPE html> 
<html> 
<head> 
    <meta charset="utf-8"> 
    <title>Userlist Demo</title> 
    <link href="css/bootstrap.css" rel="stylesheet"> 
    <style> 
    body { 
     padding-top: 60px; 
    } 
    </style> 
    <link href="css/bootstrap-responsive.css" rel="stylesheet"> 
</head> 
<body> 

    <script type="text/x-handlebars"> 
    <div class="navbar navbar-inverse navbar-fixed-top"> 
     <div class="navbar-inner"> 
     <div class="container"> 
      <a class="brand" href="#">Demo</a> 
      <div class="nav"> 
      <ul class="nav"> 
       <li>{{#linkTo 'users'}}Users{{/linkTo}}</li> 
      </ul> 
      </div> 
     </div> 
     </div> 
    </div> 

    <div class="container"> 
     {{outlet}} 
    </div> 
    </script> 

    <script type="text/x-handlebars" data-template-name="index"> 
    <h2>Demo Ember.js Application</h2> 
    <p> 
     A list of all users can be found {{#linkTo 'users'}}here{{/linkTo}}. 
    </p> 
    </script> 

    <script type="text/x-handlebars" data-template-name="users"> 
    <div class='row'> 
     <div class='span7'> 
     <table class='table table-striped'> 
      <thead> 
      <tr> 
       <th>First name</th> 
       <th>Last name <i class="icon-arrow-down"></i></th> 
       <th></th> 
      </tr> 
      </thead> 
      <tbody> 
      {{#each this itemController="user"}} 
       <tr {{bindAttr class="isDirty:warning"}}> 
       <td>{{firstName}}</td> 
       <td>{{lastName}}</td> 
       <td> 
        {{#unless isNew}} 
        {{#linkTo 'user.edit' this activeClass="disabled" classNames="btn btn-small"}}<i class="icon-edit"></i> Edit{{/linkTo}} 
        {{/unless}} 
       </td> 
       </tr> 
      {{/each}} 
      </tbody> 
     </table> 
     </div> 
     <div class='span5'> 
     {{outlet}} 
     </div> 
    </div> 
    </script> 

    <script type="text/x-handlebars" data-template-name="user/edit"> 
    <h2>Edit</h2> 
    <p><strong>First name</strong><br>{{input value=firstName type=text tabindex=1}}</p> 
    <p><strong>Last name</strong><br>{{input value=lastName type=text tabindex=2}}</p> 

    <p> 
     <button {{action 'save' this}} {{bindAttr class=":btn :btn-small :btn-primary content.isDirty:enabled:disabled"}} tabindex=4>Save changes</button> 
     <button {{action 'undo' this}} {{bindAttr class=":btn :btn-small content.isDirty:enabled:disabled"}} tabindex=5>Undo changes</button> 
    </p> 
    </script> 

    <script src="js/libs/jquery-1.9.1.js"></script> 
    <script src="js/libs/handlebars.js"></script> 
    <script src="js/libs/ember.js"></script> 
    <script src="js/libs/ember-data.js"></script> 
    <script src="js/libs/md5.js"></script> 
    <script src="js/app.js"></script> 

</body> 
</html>

출처

2013-07-08 wintermeyer

에게 app.js. 이상한 원인은 RC4에서 변경 사항이 다시 발생했다고 생각했습니다. 어쨌든,이 시도 :

아마 관련

App.UserEditRoute = Ember.Route.extend({ 
    // ... 
    setupController: function(controller, model) { 
    this._super(controller, model); 
    // ... 
    } 
}

는 : setupController이 경로 객체에 상태 (this.map)를 절약처럼 보인다. 놀랍게도 전혀 작동하지 않아 문제가 발생할 가능성이 있습니다. 대신 setupController는 로컬 컨트롤러 또는 모델 인수에서 속성을 설정하거나 this.controllerFor()를 사용하여 다른 컨트롤러에 액세스해야합니다.

이 경우 많은 코드가 필요하지 않은 것처럼 보입니다. 모델 자체를 저장/롤백 할 수 있습니다. 그래서 단순화 :

App = Ember.Application.create(); 

App.Router.map(function() { 
    this.resource('users', function() { 
    this.resource('user', { path: ':user_id' }, function() { 
     this.route('edit'); 
    }); 
    }) 
}); 

App.UsersRoute = Ember.Route.extend({ 
    model: function() { 
    return App.User.find(); 
    } 
}); 

App.UserController = Ember.ObjectController.extend(); 

App.UserEditRoute = Ember.Route.extend({ 
    model: function() { 
    return this.modelFor("user") 
    }, 

    renderTemplate: function() { 
    this.render({ into: 'users' }); 
    }, 

    events: { 
    save: function(model) { 
     model.save().then(function() { 
     App.Router.router.transitionTo('users.index') 
     }, function() { 
     alert('save failed!'); 
     }); 
    }, 
    undo: function(model) { 
     model.rollback(); 
     App.Router.router.transitionTo('users.index') 
    } 
    } 
}); 

App.Store = DS.Store.extend({ 
    adapter: 'DS.FixtureAdapter' 
}); 

App.User = DS.Model.extend({ 
    firstName: DS.attr('string'), 
    lastName: DS.attr('string') 
}); 

App.User.FIXTURES = [{ 
    id: 1, 
    firstName: "Yehuda", 
    lastName: "Katz" 
}, { 
    id: 2, 
    firstName: "Tom", 
    lastName: "Dale" 
}]

여기에 예를 들어 작업을 참조하십시오 : http://jsbin.com/ixucos/2/edit

출처

2013-07-08 17:26:12

대단히 감사합니다! – wintermeyer

Ember 1.0 RC6 라우터 정보 이해

답변

관련 문제