我有一个保存用户偏好值的用户偏好工厂。页面加载时为空。用户登录后,它会填充用户配置文件。伪码
app.factory('pref', function($rootScope){
var pref = {}, age, name;
$rootScope.$on('logged.in', function(){
pref.name = 'sam';
pref.age = 30;
pref.currency = '$';
age = getAge(); name = getName();
})
function getName(){
//format name
return name;
}
function getAge(){
return age;
}
return {
currency: pref.currency,
age: age,
name: name
}
})
然后我在我的控制器中注入工厂:
app.controller('MainCtrl', function($scope, pref) {
$scope.name = pref.name; //Return undefined
var currency = pref.currency;
$scope.price = function(amount){
return amount + currency; //don't show $ sign
}
});
未在控制器中更新来自pref工厂的返回值。我该如何让它发挥作用?
编辑:plunkrhttp://plnkr.co/edit/SKJC5hUPEm72JqGJyT9y
从pref
工厂返回的对象,
{ setPreference: setPreference,
currency: pref.currency,
name: pref.name,
formatTime: formatTime }
将CCD_ 2和CCD_。由于undefined
不是引用类型,currency
和name
将不会"看到"对象pref
的任何更新。
相反,我建议引用pref
对象的属性是工厂返回的对象的一部分:
{ setPreference: setPreference,
prefs: pref,
formatTime: formatTime }
现在,我们对pref
所做的任何更新都将反映在prefs
中。在您的控制器中参考该对象的属性如下:
console.log(prefService.prefs.name)
为了不更改pref
指向的引用,请使用angular.copy()
修改pref
引用的对象:
function setPreference(values){
//pref = values; <<-- won't work, since pref will now reference another object
angular.copy(values,pref);
}
更新:为了在name
更改时自动更新视图,我建议将对prefs
的引用保存为作用域属性:
$scope.prefs = prefService.prefs;
然后在视图/HTML:中使用{{prefs.name}}
<p>Hello {{prefs.name}}!</p>
更新plunker