2016-10-17 7 views
0

Emberアプリケーションでサーバー側のエラーを処理しようとしているときに、受信エラーがモデルに入力されていないため、テンプレートにエラーを表示できません。使用EmberモデルでRESTAdapterを使用してサーバー側のエラーが入力されない

バージョン:
エンバー-CLI:2.4.3
エンバーデータ:2.4.2
アダプター:示すようRESTAdapter

テンプレートファイルは、ユーザサインアップするためのフォームを含む:

{{input type="text" value=username }} 
    {{#each model.errors.username as |error|}} 
     {{error.message}} 
    {{/each}} 
    {{input type="text" value=email }} 
    <button {{action 'register'}}>Register</button> 

routesファイルには、アクションのユーザーを保存するために '登録' を含んでいます

register: function(){ 
    var username = this.controller.get('username'); 
    var email = this.controller.get('email'); 
    var user = this.store.createRecord('user',{ 
      email: email, 
      username: username 
     }); 
    user.save().then(function(){ 
     //handle success 
    },function(error){ 
     //handle error 
    }); 
}); 

モデルは次のようになります。

export default Model.extend({ 
    email: attr(), 
    username: attr() 
}); 

示すように、私は、ステータス422とエラーで応答を使用していますAPIを:DS.Errorsエラーのドキュメントによると

{  
    "errors":[ 
     { 
     "detail":"can't be blank", 
     "source":{ 
      "pointer": "/data/attributes/username" 
     } 
     } 
    ] 
} 

は、自分の財産にアクセスして表示することができますそのプロパティのすべてのエラーオブジェクトの配列を取得します。それが私のテンプレートファイルでやりたいことです。
また、私はエラーオブジェクトのメッセージプロパティにアクセスしようとしましたが、成功しませんでした。

{{#each model.errors.messages as |message|}} 
    {{message}} 
{{/each}} 

私は、コンソールにエラーのlengthプロパティをログに記録しようと

user.save().then(function(){ 
     //handle success 
    },function(error){ 
     //handle error 
     console.log(user.get('errors.length')); 
    }); 

、すなわちそれは常に私に0を与えるしかし

console.log(user.get('errors.username.length')); 

所望の出力が、それでもエラーが発生しますテンプレートには表示されません。
この投稿24027053で説明されているようにRESTAdapterのajaxErrorをオーバーライドしようとしましたが、運はありません。
私は何が間違っているのか分かりません。助けてください!したがって、それは誤りがない、

user.save().then(function(){ 
    //handle success 
},function(error){ 
    //handle error 
    console.log(user.get('errors.length')); 
}); 

ユーザーが保存されていません。

答えて

0

は、私はエラーが内にあると思います。これを試してみてください:

user.save().then(function(){ 
    //handle success 
},function(error){ 
    //handle error --> how do you handle it? Are you maybe overriding the default behaviour? 
    // you might want to put a 'debugger;' statement here in order to see, what the response actually looks like 
    console.log(error.errors); 
}); 
+0

を経由してエラーにアクセスすることができ、私はデフォルトをオーバーライドしていないです実際には、私はデフォルトの動作を実装することができません。私は私の質問で2回言いましたが、問題はテンプレートにエラーを表示することにあります。 console.log(user.get( 'errors.username'));ユーザー名のエラーを取得します。また、error.errorsは、目的の結果を取得します。しかし、それらはテンプレートに表示することはできません。 model.errors.username、model.errorsまたは単にerrors.usernameは何も表示しません。 –

0

エラーが発生したモデルを設定して問題を解決しました。 DS.Errorsのように見えますが、エラーが発生した後にモデルが設定されません。

今私のレジスタ機能は次のようになります。

var route = this; 
user.save().then(function(){ 
     //handle success 
    },function(error){ 
     var errors = user.get('errors'); 
     route.set('_model.errors',errors); 
    }); 

とルート・ファイル内のモデルフックがある:

_model:{}, 
model(){ 
return this.get('_model'); 
} 

レジスタ機能がエラーで_modelを移入し、モデルのフックを返すが、そう_modelそれはビューで利用可能であることを示します。それが最善の方法である場合、私は知らないが、これは私のために働いていたものです

1

テンプレートで
 save(model) { 
     model.save() 
     .then(() => { 
      console.log('success'); 
     }) 
     .catch(() => { 
      if (model.get('errors.messages.length') > 0) { 
       model.get('errors.messages').forEach((message) => { 
        console.log(message); 
       }); 
      } else { 
       console.log('failed'); 
      } 
     }); 
    } 

私は

{{#each model.errors.messages as |error|}} 
    <div class="error"> 
    {{error}} 
    </div> 
{{/each}} 
+1

以前のバージョンでは、エラーがモデルに正しく入力されていないため、テンプレートでアクセスできませんでした。しかし、後でこの問題は修正されました。 –

関連する問題