解决后承诺价值不会放入模板 [英] Promise value not put into template after resolved
问题描述
我的模型中有一个函数来检查friendhiptstatus：
friendShipStatus：function（）{
var self = this;
返回Ember.RSVP.all（[this.container.lookup（'user：current'），
this.get（'myFriends'），
this.get（'friendsWithMe'） ，
this.get（'friends'）]）然后（function（result）{
var user = result [0]，myFriends = result [1]，
friendsWithMe = result [ 2]，friends = result [3]
if（friends.contains（user））{
return 2;
} else if（friendsWithMe.contains（user））{
返回4;
} else if（myFriends.contains（user））{
return 1;
} else if（self.get（'id'）=== user.get id'））{
return 3;
} else {
return 0;
}
}）;
} .property（'friends'）
不，我只想在我的tmeplate中输出此值（例如3）：
FriendStatus：{{friendShipStatus}}< br>
但是我只得到对象输出：
< blockquote>
FriendStatus：[object Object]
如果我通过日志帮助器记录输出 {{log friendShipStatus}} 我看到承诺是通过值3解决的。为什么这个值不会放在我的模板中？
下面有一个更先进的方法，但是这种方法也是有效的。
你会想要使用观察者，然后将另一个属性设置为结果。导致承诺的计算属性应用作承诺（在其他需要等待直到该值可用的情况下）。
设置计算属性的值为反模式，计算的属性应该只是一个计算自身并返回结果的属性。如果你设置它，你将被破坏计算的属性，并说这个属性的值是 x 。这将破坏计算的属性，它将不再更新。
http://emberjs.jsbin.com/OfOhuZub/1/edit
goodValue：''，
goodObserves：function（）{
var self = this，
change = this.get（'yourInput'），
promise;
promise = new Ember.RSVP.Promise（function（resolve）{
Em.run.later（function（）{
resolve（change）;
} ，200）;
}）;
promise.then（function（result）{
self.set（'goodValue'，result）;
}）;
} .observes（'yourInput'）。on（'init'），
badComputed：function（）{
var self = this，
change = this.get（'yourInput'），
promise;
promise = new Ember.RSVP.Promise（function（resolve）{
Em.run.later（function（）{
resolve（change）;
} ，200）;
}）;
promise.then（function（result）{
// AHHH，我覆盖了我的计算属性，Whoops
self.set（'badComputed'，result）;
}）;
} .property（'yourInput'）
在你的情况下，这将是这样的：
friendShipStatus：''，
friendShipStatusObserver：function（）{
var self = this;
Ember.RSVP.all（[this.container.lookup（'user：current'），
this.get（'myFriends'），
this.get（'friendsWithMe'），
this.get（'friends'）]）然后（function（result）{
var user = result [0]，myFriends = result [1]，
friendsWithMe = result [2 ]，friends = result [3]
if（friends.contains（user））{
self.set（'friendShipStatus'，2）;
} else if（friendsWithMe.contains ）{
self.set（'friendShipStatus'，4）;
} else if（myFriends.contains（user））{
self.set（'friendShipStatus'，1）;
} else if（self.get（'id'）=== user.get（'id'））{
self.set（'friendShipStatus'，3）;
} else {
self.set（'friendShipStatus'，0）;
}
}） ;
} .observes（'friends'）
更高级的方法< h3>
您还可以构建一个可能在您的案例中更容易工作的承诺代理对象。基本上你建立一个 ObjectProxy （这与 ObjectController 一样，用于从模型到模板的代理属性）。但是您可以添加一个扭曲，您可以使用 PromiseProxyMixin ，这将允许您从承诺的解决方案中代理值。您不能仅使用{{goodComputed}}的结果，这只会打印出承诺代理。因此，您需要将解析的值包含在某种对象中， resolve（{value：change}）。在对象中，您可以在模板中使用 {{goodComputed.value}} ，它将代理承诺，因为$ $ c $上不存在值C> ObjectProxy 。我在下面举了一个例子。
goodComputed：function（）{
var self = this，
change = this.get（' yourInput'），
promise，
result;
promise = new Ember.RSVP.Promise（function（resolve）{
Em.run.later（function（）{
resolve（{value：change}）;
} ，200）;
}）;
result = Ember.ObjectProxy.extend（Ember.PromiseProxyMixin）.create（{
promise：promise
}）;
返回结果;
} .property（'yourInput'），
http://emberjs.jsbin.com/OfOhuZub/2/edit
im fairly new to javascript and promises, so I might not get all the basic concepts,but im trying.
I have a function in my model that checks the friendshiptstatus:
friendShipStatus: function() {
var self = this;
return Ember.RSVP.all([this.container.lookup('user:current'),
this.get('myFriends'),
this.get('friendsWithMe'),
this.get('friends')]).then(function(result){
var user = result[0], myFriends = result[1],
friendsWithMe = result[2], friends = result[3]
if(friends.contains(user)){
return 2;
} else if(friendsWithMe.contains(user)){
return 4;
} else if(myFriends.contains(user)){
return 1;
} else if (self.get('id') === user.get('id')){
return 3;
} else {
return 0;
}
});
}.property('friends')
No I just want to output this value (e.g. 3) in my tmeplate via:
FriendStatus :{{ friendShipStatus}}<br>
But I only get the object output:
FriendStatus :[object Object]
If I log the output via the log helper {{ log friendShipStatus }} I see that the promise is resolved with the value 3. Why is this value then not put into my template?
There is a more advanced approach below, but this approach works as well.
You're going to want to use an observer, then set another property to the result. Computed properties that result in promises should be used as promises (in the case that something else want's to wait until the value is available).
Setting a computed property's value is an anti-pattern, the computed property should be just that, a property that computes itself and returns the result. If you set it you will be blasting away the computed property and saying the value of this property is x. This will break the computed property and it won't update anymore after that.
http://emberjs.jsbin.com/OfOhuZub/1/edit
goodValue: '',
goodObserves: function(){
var self = this,
change = this.get('yourInput'),
promise;
promise = new Ember.RSVP.Promise(function(resolve){
Em.run.later(function(){
resolve(change);
}, 200);
});
promise.then(function(result){
self.set('goodValue', result);
});
}.observes('yourInput').on('init'),
badComputed: function(){
var self = this,
change = this.get('yourInput'),
promise;
promise = new Ember.RSVP.Promise(function(resolve){
Em.run.later(function(){
resolve(change);
}, 200);
});
promise.then(function(result){
// AHHH, I'm overwriting my computed property, Whoops
self.set('badComputed', result);
});
}.property('yourInput')
In your case it would be something like this:
friendShipStatus: '',
friendShipStatusObserver: function() {
var self = this;
Ember.RSVP.all([this.container.lookup('user:current'),
this.get('myFriends'),
this.get('friendsWithMe'),
this.get('friends')]).then(function(result){
var user = result[0], myFriends = result[1],
friendsWithMe = result[2], friends = result[3]
if(friends.contains(user)){
self.set('friendShipStatus', 2);
} else if(friendsWithMe.contains(user)){
self.set('friendShipStatus', 4);
} else if(myFriends.contains(user)){
self.set('friendShipStatus', 1);
} else if (self.get('id') === user.get('id')){
self.set('friendShipStatus', 3);
} else {
self.set('friendShipStatus', 0);
}
});
}.observes('friends')
More advanced approach
You can also build a promise proxy object which may work easier in your case. Essentially you build up an ObjectProxy (this is the same thing that ObjectController uses for proxying property from the model to the template). But you add a twist, you use the PromiseProxyMixin which will allow you to proxy values from the resolution of the promise. You can't use just the result, {{goodComputed}}, this would just print out the promise proxy. So you'll want to wrap your resolved value in an object of some sort, resolve({value: change}). Once in an object you could use {{goodComputed.value}} in the template and it will proxy down to the promise since value doesn't exist on the ObjectProxy. I've included an example below.
goodComputed: function(){
var self = this,
change = this.get('yourInput'),
promise,
result;
promise = new Ember.RSVP.Promise(function(resolve){
Em.run.later(function(){
resolve({value:change});
}, 200);
});
result = Ember.ObjectProxy.extend(Ember.PromiseProxyMixin).create({
promise: promise
});
return result;
}.property('yourInput'),
http://emberjs.jsbin.com/OfOhuZub/2/edit
这篇关于解决后承诺价值不会放入模板的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
