我无法使用AngularFire 0.5.0中的.$ on方法访问从firebase加载的数据
在回调当我注销范围的内容时,数据就在那里,但当我尝试使用更深入的数据时,我得到了undefined.也许我误解了你如何访问这种方法中的数据?
这是我的控制器:
.controller('AssetDetailCtrl',
['$scope', '$firebase', 'FBURL',
function($scope, $firebase, FBURL) {
var refAsset = new Firebase(FBURL + '/assets/' + $scope.assetId);
$scope.asset = $firebase(refAsset);
// when data is loaded check validity of the route
$scope.asset.$on('loaded', function() {
console.log($scope.asset); // complete with the asset data
console.log($scope.asset.name); // undefined even though it appears in the above console log
});
}])
Run Code Online (Sandbox Code Playgroud)
所以也许有更好的方法来做到这一点.
为什么即使它登录到控制台,我也无法访问范围内的数据?
这是第一个console.log的结果
Object { $bind: function, $add: function, $save: function, $set: function, $remove: function…}
$add: function (b,c){var d;return …Run Code Online (Sandbox Code Playgroud) 我正在使用AngularFire模块开发一个使用Angular和Firebase的简单todo应用程序.
所以我的模型中有一个布尔属性,由模板中的复选框表示,问题是我正在尝试使用AngularFire的三路数据绑定,使用该$bind方法保持所有更改同步(firebase数据,DOM和ng) -model)但是当我选中一个复选框时,firebase数据没有更新.
这是我使用AngularFire $bind方法的控制器:
angular.module('singularPracticeApp')
.controller('TodoCtrl', ['$scope', 'TodoService', function ($scope, todoService) {
$scope.todos = todoService;
$scope.todos.$bind($scope, 'todo.done');
$scope.addTodo = function () {
$scope.todos.$add({text: $scope.todoText, done:false});
$scope.todoText = '';
};
$scope.remaining = function () {
var count = -11;
angular.forEach($scope.todos, function(todo){
count += todo.done? 0 : 1;
});
return count;
};
$scope.clear = function (id) {
$scope.todos.$remove(id);
};
}]);
Run Code Online (Sandbox Code Playgroud)
这是tempalte文件:
<div ng-controller="TodoCtrl">
<h4>Task runner</h4>
<span>{{remaining()}} todos left.</span>
<ul>
<li ng-repeat="(id, todo) in todos">
<input type="checkbox" ng-model="todo.done">
<span …Run Code Online (Sandbox Code Playgroud) 我正在为Firebase和AngularFire创建一个由用户,帖子和评论组成的数据结构.我的印象是用户的密钥/ ID是用户名,而评论和帖子的密钥/ ID将是自动生成的firebase密钥.
我一直在研究angularfire文档,并对$push()使用该方法时添加到对象的自动生成的键(name())感到困惑.
查看firebase网站上的一些示例,我看到Users对象的示例没有自动生成的密钥 - 单个用户的密钥是用户名 - 但同时添加密钥数组通过的对象 $push
我的问题是:
1)我应该一直使用firebase自动生成的密钥吗?如果没有,那么如何添加新用户,因为$push()自动创建密钥,并$set()重置所有用户?
2)$id和之间有什么关系name()?
示例数据
来自https://www.firebase.com/docs/web/guide/saving-data.html
文档显示以下Users对象:
{
"users": {
"alanisawesome": {
"date_of_birth": "June 23, 1912",
"full_name": "Alan Turing"
},
"gracehop": {
"date_of_birth": "December 9, 1906",
"full_name": "Grace Hopper"
}
}
}
Run Code Online (Sandbox Code Playgroud)
如何在不重置当前用户$set()或添加angularfire id的情况下添加更多用户push()?
然后是一个带有生成id的Posts对象:
{
"posts": {
"-JRHTHaIs-jNPLXOQivY": {
"author": "gracehop",
"title": "Announcing COBOL, a New Programming Language"
},
"-JRHTHaKuITFIhnj02kE": {
"author": "alanisawesome", …Run Code Online (Sandbox Code Playgroud) 我想为我的演示做一个自定义登录,但是我遇到了一个问题.
我使用用户名来访问Firebase中的引用网址,我得到了一个返回的对象.如果我想访问单个属性,我会得到未定义的值,但如果我添加我的html {{returnedObj.name}},则会显示该值.
这是为什么?
angular.module('Demo').controller('loginCtrl', ['$scope', '$firebase', '$location', function($scope, $firebase, $location){
$scope.user = {};
$scope.check = function(){
console.log('https://fabritzio-demo.firebaseio.com/users/' + $scope.user.name);
$scope.returnedObj = $firebase(new Firebase('https://fabritzio-demo.firebaseio.com/usuarios/' + $scope.user.name)).$asObject();
alert($scope.returnedObj.name); // returns undefined value
};
Run Code Online (Sandbox Code Playgroud)
}]);
我正在使用angularFire 0.8.2,我正在尝试检查用户的唯一性.
该用户存储在users/[id]中,其中[id]是用于登录/密码用户的simpleLogin生成的id和用于来自社交网络的社交uid(即:facebook:891239120).
因此,当我使用facebook登录时,我需要检查该用户是否已经在firebase中,所以我正在使用(来自angularFire-seed):
var userData = fbutil.syncObject('users/' + user.uid);
userData.$loaded()
.then(function (data) {
if(data) {
console.log('EXISTS');
console.log(data.$id);
} else {
console.log('NOT EXISTS');
}
}, function (err) {
console.error(err);
});
Run Code Online (Sandbox Code Playgroud)
但这不起作用,因为始终返回数据对象(即使对象没有关键user.uid不存在)
我发现obj.$ value在obj为空时填充为null,而当obj没有原始值时不存在,但我不确定这是否是检查它的正确方法.
而且我也不知道我是否使用$ asArray on/users它会在firebase上加载每个用户而不是生产它可能会出现性能问题?
我目前正在开始进行角度单元测试.作为我想要的第一个控制器看起来像这样,我感到困惑.
angular.module('sgmPaperApp')
.controller('AccountCtrl', function ($mdToast, user, $firebaseArray, Ref) {
var vm = this;
vm.data = user;
vm.save = saveUser;
vm.comments = $firebaseArray(Ref.child('comments').orderByChild('person').equalTo(user.$id));
function saveUser() {
vm.data.$save().then(function () {
$mdToast.showSimple('Data saved');
});
}
});
Run Code Online (Sandbox Code Playgroud)
我应该真的模仿我使用的所有外部服务吗?毕竟那个控制器不是很多,那么外部服务和嘲笑firebaseArray可能很困难.
感谢您的建议并帮助我开始测试
所以我在firebase中有这个例子
clients {
//clients with unique keys {
invoices: {
// Invoices with unique Keys
}
}
}
Run Code Online (Sandbox Code Playgroud)
我正在用一个ref返回所有这些,如下所示:
.controller('singleClientController', function($scope, $firebaseObject, fbUrl, $routeParams) {
var id = $routeParams.id;
var singleRef = new Firebase(fbUrl+'/clients/'+id);
var client = this;
client.details = $firebaseObject(singleRef);
})
Run Code Online (Sandbox Code Playgroud)
所以在我的HTML中,我试图返回$id客户端和发票.我能够让客户端没有问题{{client.details.$id}}但是当我尝试用发票ID {{invoice.$id}}做同样的事情时我什么也得不到.
发票通过foreach显示如下:
<tr ng-repeat="invoice in client.details.invoices">
<td>
<a href="#/invoices/details/{{invoice.$id}}/{{client.details.$id}}">
{{invoice.settings.number}}
</a>
</td>
...
</tr>
Run Code Online (Sandbox Code Playgroud)
是因为发票在客户内吗?如果是这样,您将如何返回发票的ID?这让我疯了!请帮忙!
为了更好地理解我的firebase设置,这里是我正在谈论的截图.
我在其最新版本使用angularFire 2.0.1,但我看到关于如何更新信息"显示名"信息尝试获取用户信息firebase.User(),但我得到的错误"getApi"我是被误导quisas如何更新用户创建的信息前
我正在尝试使用Ionic2/typescript进行电话号码身份验证,并初始化recaptcha验证程序,如下所示:
.ts文件
import firebase from 'firebase';
@IonicPage()
@Component({
selector: 'page-login',
templateUrl: 'login.html',
})
export class LoginPage {
public recaptchaVerifier:firebase.auth.RecaptchaVerifier;
constructor(afAuth: AngularFireAuth, public authData: AuthProvider, public alertController: AlertController, formBuilder: FormBuilder, public navCtrl: NavController, public navParams: NavParams) {
this.loginForm = formBuilder.group({
phone: ['', Validators.compose([Validators.required,
Validator.isValidPhone])]
});
try {
this.recaptchaVerifier = new firebase.auth.RecaptchaVerifier('recaptcha-container');
}catch(e){
console.log("There was a problem in initializing the recapctha verifier: " + e);
}
this.authData.recaptchaVerifier = this.recaptchaVerifier;
}
}
Run Code Online (Sandbox Code Playgroud)
.html文件
<ion-content padding>
<div id="recaptcha-container"></div>
<form [formGroup]="loginForm" (submit)="loginUser()" novalidate> …Run Code Online (Sandbox Code Playgroud) 我正在使用AngularFire2创建具有Firebase和Angular 5的登录系统。单击登录并注销后,一切正常。一个问题是,如果刷新页面,如下图所示,我会闪烁。显然,发生这种情况是因为javascript需要花费一些时间来加载。解决此问题的最佳方法是什么?通常,我使用PHP或其他后端语言创建登录系统,所以我永远不会遇到这个问题,因为我只检查SESSION变量进行登录,而页面直到完成才加载完成。在此页面立即加载,然后Javascript检查您是否已登录。
我知道我可以使用加载微调器,但我不喜欢使用该技巧的网站。另一种可能性是使用Javascript Cookie或JWT。我只想找出最佳做法。
另外,使用Firebase和Angular的登录系统是否也不安全,因为用户可以只更改Javascript变量?例如,用户可以设置afAuth.user。私人用户仪表板检查是否设置了此变量,并让用户查看此页面(如果已设置)。因此,有人不能通过设置afAuth.user变量进入私有仪表板。我了解我可以使用规则保护Firebase数据,并可以确保用户在访问数据库之前已登录。但是,如果您使用Firebase对前端Javascript进行身份验证,似乎无法对用户隐藏HTML代码。
这是 app.component.html
<div *ngIf="afAuth.user | async as user; else showLogin">
<h1>Hello {{ user.displayName }}!</h1>
<button (click)="logout()">Logout</button>
</div>
<ng-template #showLogin>
<p>Please login.</p>
<button (click)="login()">Login</button>
</ng-template>
<router-outlet></router-outlet>
Run Code Online (Sandbox Code Playgroud)
我的app.component.ts档案是
import { Component } from '@angular/core';
import { AngularFirestore } from 'angularfire2/firestore';
import { AngularFireAuth } from 'angularfire2/auth';
import { auth } from 'firebase/app';
import { Observable } from 'rxjs';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent {
title …Run Code Online (Sandbox Code Playgroud) angularfire ×10
firebase ×9
angularjs ×7
javascript ×2
angular ×1
data-binding ×1
ionic2 ×1
ionic3 ×1
unit-testing ×1