EmberJS-レコードのプッシュ

アプリケーションからレコードを要求することなく、レコードをストアのキャッシュにプッシュできます。レコードがキャッシュ内にあるときにのみルートまたはコントローラーから要求された場合、ストアにはレコードを返す機能があります。

例

以下の例は、エンバーファイアベースへのレコードのプッシュを示しています。次のコードで_app/templates/_の下に作成された_application.hbs_ファイルを開きます-

<h2>Pushing Record into Store</h2>
<form>
   {{input type = "name" value = nameAddress placeholder = "Enter the text"
      autofocus = "autofocus"}}
  //when user clicks the send button, the 'saveInvitation' action will get triggered
   <button {{action 'saveInvitation'}} >Send</button>
</form>

{{#if responseMessage}}
  //display the response sessage after sending the text successfully
   {{responseMessage}}
{{/if}}
{{outlet}}

_app/models/_の下に作成される_invitation_という名前のモデルを作成します。ファイルを開き、次のコードを含めます-

import DS from 'ember-data';

export default DS.Model.extend ({
  //specifying attribute using 'attr()' method
   name: DS.attr('string')
});

次に、_app/controllers/_の下に作成されるapplicationという名前のコントローラーを作成します。ファイルを開き、次のコードを追加します-

import Ember from 'ember';

export default Ember.Controller.extend ({
   headerMessage: 'Coming Soon',
  //displays the response message after sending record to store
   responseMessage: '',
   nameAddress: '',

   actions: {
     //this action name which fires when user clicks send button
      saveInvitation() {
         const name = this.get('nameAddress');
        //create the records on the store by calling createRecord() method
         const newInvitation = this.store.createRecord('invitation', { name: name });
         newInvitation.save();//call the save() method to persist the record to the backend
         this.set('responseMessage', `Thank you! We have saved your Name: ${this.get('nameAddress')}`);
         this.set('nameAddress', '');
      }
   }
});

Ember FirebaseにJSON形式で情報を保存できます。これを行うには、https://firebase.google.com/[Firebase’s website]を使用してアカウントを作成する必要があります。アプリケーションでFirebaseを作成して構成する方法の詳細については、次のリンクをクリックしてください：/emberjs/route_multiple_models [link]。

出力

エンバーサーバーを実行すると、下のスクリーンショットに示すように値を入力する入力ボックスが表示されます-

Ember.jsストアにレコードをプッシュ

送信ボタンをクリックした後、ユーザーが入力したテキストが表示されます-

Ember.jsストアにレコードをプッシュ

今、あなたのfirebaseデータベースを開くと、_Database_セクションの下に保存された値が表示されます-

Ember.jsレコードをストアにプッシュ

Emberjs-model-push-rec-into-store

EmberJS-レコードのプッシュ

例

出力