燃えさしヘルパーは

Question

私は、これが働いている

init(){ 
    this._super(...arguments); 
    const context = this; 
    if ((this.get('localStorage').getItem('idProfileDesa')) !== null && (this.get('localStorage').getItem('idProfileDesa')) !== undefined) { 
     if ((this.get('localStorage').getItem('idProfileDesa')) !== 0) { 
     this.get('registerProfileDesaService').findByProfileFormId(this.get('localStorage').getItem('idProfileDesa')).then(
      function (response) { 
      context.debug(JSON.stringify(response)); 
      context.set("alamat", response.alamat); 
      context.set("kodeWilayah", response.kodeWilayah); 
      context.set("noTelp", response.noTelepon); 
      context.set("lokasiWilayah", response.lokasiWilayah); 
      context.set("email", response.email); 
      context.set("website", response.website); 
      context.set("jumlahDusun", response.jumlahDusun); 
      context.set("jumlahRw", response.jumlahRW); 
      context.set("jumlahRt", response.jumlahRT); 
      context.set("jumlahKepalaKeluarga", response.jumlahKepalaKeluarga); 
      context.set("jumlahRumahTangga", response.jumlahRumahTangga); 
      context.set("jumlahPenduduk", response.jumlahPenduduk); 
      context.set("lokasiKantor", response.lokasiKantor); 
      context.set("pos", response.pos); 
      }, function (e) { 
      context.debug(e); 
      context.get('commonService').showNotification(e); 
      }); 
     } 
    } 
    } 

燃えさしのinitメソッドは、彼らが呼び出すコンポーネントAJAX要求を書きましたが、残念ながら私の燃えさしヘルパーは、Ajaxリクエストを待っていないと言いました'データ'はコンソールログで定義されていません

import Ember from 'ember'; 

export function validateIsEmail(params/*, hash*/) { 
    let email = params[0]; 
    let mustHaveChar = ["@",".com",".co.id",".id",".org"]; 
    let didHasWord = 0; 
    mustHaveChar.forEach(function (word) { 
    didHasWord = didHasWord + email.includes(word); 
    }); 

    return (didHasWord > 1); 
} 

export default Ember.Helper.helper(validateIsEmail); 

私のemberヘルパーがajaxリクエストを待っているようにするにはどうすればいいですか？

Answer 1

読み込み前に2度注意してください。data inside components。コンポーネントは可能な限り分離されています。私は、コンポーネント内にデータをロードする必要があるケースが多いことを理解しています。あなたのケースでは、データをコンテナ内にロードし、それをコンポーネントに渡してレンダリングすることによって、親コンテナ（コントローラかもしれない）からデータをコンポーネントに渡すことができます。

あなたの質問に答えるために、ヘルパーはテンプレートで呼び出されるとすぐに担当し、コンポーネントの状態については心配しません。したがって、データが完全にロードされるまでヘルパーを起動しないようにしてください。あなたのコンポーネントファイルで

、コンポーネントのテンプレートで

init() { 
    this._super(...arguments); 
    this.set('isLoading', true); // <- setting the loading state explicitly 
    $.ajax('https://jsonplaceholder.typicode.com/users').then((data) => { 
     this.set('users', data); 
     this.set('isLoading', false); // <- make it false after the data loads 
    }); 
    } 

、

{{#unless isLoading}} <!-- render the component only if the data finished loading --> 
    {{#each users as |user|}} 
    <li>{{user.name}} : 
     {{#if (isemail user.email)}} 
     {{user.email}} 
    {{else}} 
     <span style="color: red">(The email is invaild)</span> 
    {{/if}} 
    </li> 
    {{/each}} 
{{/unless}} 

詳細な呼び出しのためにひねりこれを参照してください：https://ember-twiddle.com/53bd472bbeaa42d1790da2ba97a6a803?openFiles=templates.components.my-comp.hbs%2Ctemplates.components.my-comp.hbs