火力地堡angularfire孩子。$ asObject给未定义的属性 [英] Firebase angularfire child.$asObject give properties undefined
本文介绍了火力地堡angularfire孩子。$ asObject给未定义的属性的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我这有code：
工厂
app.factory（'项目'，函数（$火力点，FIREBASE_URL）{
VAR REF =新的火力地堡（FIREBASE_URL）;
VAR项目= $火力（ref.child（'项目'））$ asArray（）。
VAR项目= {
所有：功能（）{
返回的物品;
}，
创建：函数（项目）{
返回项目$添加（项目）。
}，
得到：函数（的itemId）{
返回$火力$ asObject（）（ref.child（项目）的孩子（的itemId））。
}，
更新：功能（的itemId，项目）{
返回$火力更新（项目）（ref.child（项目）的孩子（的itemId））。
}，
删除：函数（项目）{
返回项目$删除（项目）。
}
};
归还物品;
}）;
路线
的app.config（函数（$ stateProvider）{
$ stateProvider
.STATE（'items_update'，{
网址：'/项目/更新/：身份证'，
templateUrl：意见/项目/ form.html'，
控制器：'ItemsUpdateController'，
解决：{
项目：函数（项目，$ stateParams）{
返回Items.get（$ stateParams.id）;
}
}
}）
}）;
控制器
app.controller（'ItemsUpdateController'，函数（$范围，项目，$州）{
$ scope.item =项目;
的console.log（$ scope.item.url）;
$ scope.add =功能（）{
Items.update（$ scope.item）。然后（函数（）{
$ state.transitionTo（'项目'）;
}）;
}
}）;
为什么的console.log（$ scope.item.url）;赐我不确定？
但鉴于我已经得到了所有数据
HTML
＆LT;窗体类=形横角色=形式NAME =形式数据-NG-提交=增加（）＆GT;
＆LT; DIV CLASS =表单组＆GT;
＆LT;输入类型=文本名称=头衔的tabindex =1级=表格控占位={{'items.form.title|翻译}}数据-NG-模式=项.title伪所需=必需的数据-NG-MINLENGTH个=3数据-NG-MAXLENGTH =25的用户反馈/＆GT;
＆LT; / DIV＆GT;
＆LT; DIV CLASS =表单组＆GT;
＆LT;输入类型=文本名称=配料的tabindex =2级=表格控占位={{'items.form.ingredients|翻译}}数据-NG-模式=项.ingredients所需=必需的NG-模式=/ ^ \\ W（\\ S * \\ S * \\ W？）* $ /用户反馈/＆GT;
＆LT; / DIV＆GT;
＆LT; DIV CLASS =表单组＆GT;
＆LT;输入类型=文本名称=价格的tabindex =3级=表格控占位={{'items.form.price|翻译}}数据-NG-模式=项。价格所需=必需的数据智能浮动用户反馈/＆GT;
＆LT; / DIV＆GT;
＆LT; DIV CLASS =表单组＆GT;
＆LT;按钮式=按钮的tabindex =4级=BTN BTN-默认BTN-LG项=项目数据上传＆GT; {{'items.form.upload|翻译}}＆LT; /按钮＆GT;
＆LT;输入类型=文本名称=URL的风格=显示：无;所需=必需的数据-NG-模式=item.url/＆GT;
＆LT; / DIV＆GT;
＆LT; DIV CLASS =表单组的形式，不要求clearfix＆GT;
＆LT; DIV CLASS =右拉＆GT;
＆LT;按钮式=提交的tabindex =5级=BTN BTN-主要数据-NG-禁用=＆GT的形式$无效的。{{'items.form.submit|翻译}}＆LT; /按钮＆GT;
＆LT; / DIV＆GT;
＆LT; / DIV＆GT;
＆LT; /表及GT;
结束
作为@Frank面包车Puffelen评论
我的工作了有：
app.controller（'ItemsUpdateController'，函数（$范围，项目，$州）{
项目。$（）加载，然后（功能（数据）{
$ scope.item =数据;
的console.log（$ scope.item.url）;
}）;
$ scope.add =功能（）{
Items.update（$ scope.item）。然后（函数（）{
$ state.transitionTo（'项目'）;
}）;
}
}）;
解决方案
这是因为当你的的console.log（$ scope.item.url）; 运行时，数据还没有从火力地堡加载爱好。从火力地堡/ AngularFire通知角监听知道什么时候加载数据，然后更新视图。
另请参阅<一个href=\"http://stackoverflow.com/questions/26395912/angularfire-why-cant-i-loop-over-array-returned-by-asarray/26403301#26403301\">angularfire - 为什么可以用$ asArray 和<一个阵列上我没有回圈href=\"http://stackoverflow.com/questions/26268446/trying-to-get-child-records-from-firebase/26277382#26277382\">Trying从火力地堡获取子记录。
I've got this code:
factory
app.factory('Items', function($firebase,FIREBASE_URL) {
var ref = new Firebase(FIREBASE_URL);
var items = $firebase(ref.child('items')).$asArray();
var Item = {
all: function () {
return items;
},
create: function (item) {
return items.$add(item);
},
get: function (itemId) {
return $firebase(ref.child('items').child(itemId)).$asObject();
},
update: function (itemId, item) {
return $firebase(ref.child('items').child(itemId)).update(item);
},
delete: function (item) {
return items.$remove(item);
}
};
return Item;
});
route
app.config(function($stateProvider) {
$stateProvider
.state('items_update', {
url: '/items/update/:id',
templateUrl: 'views/items/form.html',
controller:'ItemsUpdateController',
resolve:{
item:function(Items,$stateParams){
return Items.get($stateParams.id);
}
}
})
});
controller
app.controller('ItemsUpdateController', function ($scope, item, $state) {
$scope.item = item;
console.log($scope.item.url);
$scope.add = function() {
Items.update($scope.item).then(function () {
$state.transitionTo('items');
});
}
});
why console.log($scope.item.url); give me undefined ?
but in the view I've got all the data
html
<form class="form-horizontal" role="form" name="form" data-ng-submit="add()">
<div class="form-group">
<input type="text" name="title" tabindex="1" class="form-control" placeholder="{{ 'items.form.title' | translate }}" data-ng-model="item.title" required="required" data-ng-minlength="3" data-ng-maxlength="25" user-feedback />
</div>
<div class="form-group">
<input type="text" name="ingredients" tabindex="2" class="form-control" placeholder="{{ 'items.form.ingredients' | translate }}" data-ng-model="item.ingredients" required="required" ng-pattern="/^\w(\s*,?\s*\w)*$/" user-feedback />
</div>
<div class="form-group">
<input type="text" name="price" tabindex="3" class="form-control" placeholder="{{ 'items.form.price' | translate }}" data-ng-model="item.price" required="required" data-smart-float user-feedback />
</div>
<div class="form-group">
<button type="button" tabindex="4" class="btn btn-default btn-lg" item="item" data-uploader>{{ 'items.form.upload' | translate }}</button>
<input type="text" name="url" style="display:none;" required="required" data-ng-model="item.url" />
</div>
<div class="form-group form-no-required clearfix">
<div class="pull-right">
<button type="submit" tabindex="5" class="btn btn-primary" data-ng-disabled="form.$invalid">{{ 'items.form.submit' | translate }}</button>
</div>
</div>
</form>
ENDS UP
as in the @Frank van Puffelen comment I worked it out with:
app.controller('ItemsUpdateController', function($scope, item, $state) {
item.$loaded().then(function(data) {
$scope.item = data;
console.log($scope.item.url);
});
$scope.add = function() {
Items.update($scope.item).then(function() {
$state.transitionTo('items');
});
}
});
解决方案
This is because by the time your console.log($scope.item.url); runs, the data hasn't been loaded from Firebase yet. Angular listens for a notification from Firebase/AngularFire to know when the data has loaded and then updates the view.
Also see angularfire - why can't I loop over array returned by $asArray? and Trying to get child records from Firebase.
这篇关于火力地堡angularfire孩子。$ asObject给未定义的属性的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
