1

レコードを作成し、特定のオブジェクトのリソースのリストに遷移するフォームがあります。ただし、レコードが作成されると、リソースのリストには反映されません。ページを更新すると、レコードは正しい場所に保存されます。私は ember chrome 拡張機能をインストールしており、[リソース] の下を見ると、リソースが正しいバッジを指しています。しかし、最初にバッジにアクセスしてリソースを探すと、一覧に表示されません。何か案は?明確にするために必要な情報をさらに提供していただければ幸いです。前もって感謝します

リソース フォーム コントローラーとルートの作成

コントローラ

    App.ResourcesCreateController = Ember.ObjectController.extend({
  resourceTypes: ["link","file","video"],
  needs: ['badge','resourcesIndex'],

  actions: {
    save: function() {

      //Gather the info from the form
      var description = this.get('description');
      var url = this.get('url');
      var type = this.get('type');
      var text = this.get('text');
      var badge = this.get('controllers.badge').get('model');

      //set the data to the model of the route (ResourceCreateRoute)
      var resource = this.get('model');
      console.log(resource);
      resource.set('description',description);
      resource.set('url',url);
      resource.set('type',type);
      resource.set('text',text);
      resource.set('badge',badge);

      var self = this;

      //save the route
      var a = resource.save().then(function() {

        //if success
        //this.get('store').reload();
        console.log('%c that resource saved rather nicely','color:green;');

        self.transitionToRoute('resources.index',self.badge);

      }, function() {

        //if failure
        console.log('%c Yea boss...that didnt go so hot', 'color:red;');
        self.set('isError',true);
      });

    },
    reset: function() {
      this.transitionToRoute('resources.index');
    }
  }


});

ルート

App.ResourcesCreateRoute = Ember.Route.extend({
    model: function() {
        return this.store.createRecord('resource');
    }
})

リソースルートの一覧表示

App.ResourcesRoute = Ember.Route.extend({
    model: function(){
        return this.modelFor('badge').get('resources');
    }
});

モデル

リソース モデル

App.Resource = DS.Model.extend({
    'badge': DS.belongsTo('badge'),
    'text': attr('string'),
    'url': attr('string'),
    'description': attr('string'),
    'type': attr('string')
});

バッジモデル

App.Badge = DS.Model.extend({
    'category': DS.belongsTo('category'),
    'title': attr('string'),
    'type': attr('string'),
    'ord': attr('number'),
    'short_description': attr('string'),
    'full_description': attr('string'),
    'mentor': DS.belongsTo('employee'),
    'parent':DS.belongsTo('badge'),
    'icon': attr('string'),
    'required': attr('boolean'),
    'signoff_role': attr('string'),
    'created_at': attr('string'),
    'updated_at': attr('string'),
    'resources': DS.hasMany('resource', { async: true } ),
    'quiz': DS.belongsTo('quiz', { async: true } )
});

テンプレート

リソースのリスト

{{#link-to "resources.create" class="btn btn-primary btn-xs pull-right"}} Create Resource {{icon "plus"}}{{/link-to}}
<h3>Resources</h3>
<dl>
    {{#each  resource in controller}}
        {{render resources/resource resource}}
    {{else}}
        <p class="lead text-muted">There are no resources</p>
    {{/each}}
</dl>

リソース アイテム テンプレート

{{#if isEditing}}
    <div {{bindAttr class="controller.isError:alert-danger:alert-info :alert"}}>
        <div class="row">
            <div class="col col-lg-2">
            <small>Type</small>
                {{view Ember.Select contentBinding="resourceTypes" classNames="form-control" valueBinding="type"}}
            </div>
            <div class="col col-lg-10">
                <small>Resource Name</small>
                {{input valueBinding="text" class="form-control"}}
            </div>

        </div>
        <div class="row">
            <div class="col col-lg-12">
            <br>
                <small>Description</small>
                {{textarea valueBinding="description" rows="5" class="form-control"}}
            </div>
        </div>
        <div class="row">
            <div class="col col-lg-12">
                <br>
                <small>URL,File Name, or Vimeo ID</small>
                {{input valueBinding="url" class="form-control"}}
            </div>
        </div>

        <hr>
        <div class="btn-group">
         <div {{action "save"}} class="btn btn-primary">{{icon "floppy-save"}} Save</div>
         {{#if confirmDelete}}
            <div {{action "delete"}} class="btn btn-danger">{{icon "trash"}} Are You sure?</div>
         {{else}}
            <div {{action "confirm"}} class="btn btn-danger">{{icon "trash"}} Delete</div>
         {{/if}}
         </div>

         <div {{action "reset"}} class="btn btn-default"> {{icon "ban-circle"}} Cancel</div>
    </div>

    {{else}}

    <div class="btn-group pull-right btn-group-xs">
        {{#if view.hover }}
        <div {{action "edit"}} class="btn btn-default">{{icon "cog"}}</div>
        {{/if}}
    </div>
    <dt>
        <span class="text-muted">{{resource_icon type}}</span> {{text}}
    </dt>
    {{#if description}}
    <dd class="text-muted"  style="margin-bottom:1em">
        {{markdown description}}
    </dd>
    {{/if}}
    <hr>
{{/if}}

リソース テンプレートの作成

<h3>Create Resource</h3>
    <div class="row">
            <div class="col col-lg-2">
            <small>Type</small>
                {{view Ember.Select contentBinding="resourceTypes" classNames="form-control" valueBinding="type"}}
            </div>
            <div class="col col-lg-10">
                <small>Resource Name</small>
                {{input valueBinding="text" class="form-control"}}
            </div>

        </div>
        <div class="row">
            <div class="col col-lg-12">
            <br>
                <small>Description</small>
                {{textarea valueBinding="description" rows="5" class="form-control"}}
            </div>
        </div>
        <div class="row">
            <div class="col col-lg-12">
                <br>
                <small>URL,File Name, or Vimeo ID</small>
                {{input valueBinding="url" class="form-control"}}
            </div>
        </div>

        <hr>

         <div {{action "save"}} class="btn btn-primary">{{icon "floppy-save"}} Save</div>
         <div {{action "test"}} class="btn btn">Test</div>
         {{#link-to "resources.index" class="btn btn-default" }}  {{icon "ban-circle"}} Cancel {{/link-to}}
         <br><br>
    </div>
4

4 に答える 4

1

最初に一般的な注意事項をいくつか。

  1. これだけのコードがあれば、JSBin か何かを提供すれば、誰もが簡単にあなたを助けることができます。あなたにとっては少し余分な作業ですが、あなたは助けを求めています。これは頭の中で解析して実行するだけでも大変です。個人的には、ルーターが含まれていなかったため、余分なオーバーヘッドが発生したため、バッジとリソースがどのように関連しているかを把握するためだけにパスを実行する必要がありました.

  2. ルート モデルを新しいレコードに設定し、入力ヘルパーを使用して ObjectController を使用している場合、そのすべての設定を行う必要はありません。そのため、ヘルパーでこれらの値バインディングを指定しました。しかし、たくさんのプロパティを設定する必要がある場合は、次のようなものを使用して一度にすべてを設定するだけでrecord.setProperties({prop1: prop1Value, prop2: prop2Value ...});、入力の手間を省くことができます。

  3. resourcesIndexResourcesCreateController の必要性として使用している理由がわかりません。実際にあなたの質問に答えるには'resources'、必要に応じて指定するとうまくいくかもしれません

次に、次のようなものを使用します

resource.save().then(function(record){
  self.get("controllers.resources").pushObject(record);
  self.transitionToRoute("resources.index", badge); // I don't know if this makes any sense because you didn't show your router, but at the very least, don't use self.badge, or even self.get("badge"), because badge is already accessible in this scope.
}
于 2013-10-16T10:16:02.083 に答える
0

修理済み。これがこれを処理する正しい方法かどうかはわかりませんが、基本的に、子モデルを作成して保存したら、親モデルをリロードする必要がありました。このように

save: function() {
  var self = this;

  var resource = this.store.createRecord('resource',{
     property: 'property',
     relatedProperty: this.get('model'),
     //etc
  });

  resource.save().then(function(){
      self.get('model').reload();
  },function(){
     //do stuff because the resource didnt save
  });

}
于 2013-10-24T17:13:53.067 に答える
0

新しいリソースを作成するとき、それをストアに入れていないようです。this.store.createRecord(resource)の代わりに then のようなものを試してくださいresource.savethis.store.commit.

私が正しいかどうかは完全にはわかりません。しかし、それは可能性があるかもしれません。

于 2013-10-15T18:14:48.820 に答える
0

モデルの定義を確認できれば幸いです。また、問題を示す jsbin の設定があればさらに良いでしょう。

いつでも createRecord に接続してみることができます。

 App.ResourcesCreateRoute = Ember.Route.extend({
    model: function() {
     return this.store.createRecord('resource', {badge: this.modelFor('badge')});
    }
 })
于 2013-10-15T03:02:42.377 に答える