标签: angularfire
jsHint投掷'Firebase'未定义警告
如何正确定义Firebase,以便jshint停止发出哔哔声.
我的代码正在运行......只是jshint很烦人
app.js
angular
.module('morningharwoodApp', [
'firebase',
'ngAnimate',
'ngCookies',
'ngResource',
'ngRoute',
'ngSanitize',
'ngTouch'
])
main.js
angular.module('morningharwoodApp')
.controller('MainCtrl', function ($scope, $firebase) {
// var Firebase;
var pageRef = new Firebase('https://morningharwood.firebaseIO.com/page');
// var pageRef = new Firebase('https://morningharwood.firebaseIO.com/page');
//init
$scope.pages = $firebase(pageRef);
$scope.newPage = {
title: '',
slug: '',
url: '',
desc: '',
active: false,
template: [
{
type: ''
}
],
img: '',
dateCreated: '',
dateUpdated: ''
};
//CRUD
//add
$scope.addPage = function() {
$scope.pages.$add($scope.newPage);
$scope.newPage = '';
};
});
推荐指数
解决办法
查看次数
使用AngularFire时,光标会在键入时跳转到字段结尾
我设置了一个编辑一个字段的小样本应用程序.但是当我输入该字段时,内容会一直恢复到一秒钟之前.我正在寻找AngularFire的修复程序,它可以使它正常工作,或者我正在寻找一个我没有正确初始化它的RTFM.此时bindTo()不可用,我根本无法继续使用AngularFire.
这是完整的示例(您可以在http://jsbin.com/wabafu/3上打开它):
<!DOCTYPE html>
<html ng-app="myapp">
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.0-beta.14/angular.min.js"></script>
<script src='https://cdn.firebase.com/js/client/1.0.19/firebase.js'></script>
<script src='https://cdn.firebase.com/libs/angularfire/0.8.0/angularfire.min.js'></script>
<script>
var app = angular.module("myapp", ["firebase"]);
function MyController($scope, $firebase) {
var ref = new Firebase("https://stackoverflow25331760.firebaseIO.com/"),
syncObject = $firebase(ref).$asObject();
syncObject.$bindTo($scope, "data");
}
</script>
</head>
<body ng-controller="MyController">
<h3>
<input type="checkbox" ng-model="EditMode"> Enable Editing
</h3>
<div ng-if="EditMode">
<input type="text" ng-model="data.SyncValue" style="width:100%">
</div>
<div ng-if="!EditMode">
{{data.SyncValue}}
</div>
</body>
</html>
它只在一个浏览器中打开时工作顺畅,但是当打开多个时,我不能输入多于一个字或两个字而没有文本内容恢复到几个键击前并且光标移动到字段的末尾.
我想发生的事件是:
- 我输入,值在angularjs(GOOD)中更新
- Angularfire将新值发送到firebase(GOOD)
- Firebase将值发送给其他浏览器(我继续输入时)(好)
- 其他浏览器收到新值并更新其html(GOOD)
- 其他浏览器将值重新发送回firebase,就像它是新信息一样(真的很糟糕)
- Firebase接收到这个回显过时的值并将其推回给我(BAD)
- 我的浏览器获得了这个第二旧的值,因为它与我文本字段中的内容不同,我的fiedl的内容被恢复(BAD)
我想这个过程是错的吗？我该怎么做才能停止第5步？
PS测试时,我发现我可以通过快速键入几个字符然后等待2秒重复来解决#7问题.这样,当同步回显并且我的光标不会跳转时,该值不会改变.
PPS为了尝试缩小范围,我创建了一个复选框来控制数据是显示在字段中,还是只显示只读div.即使第二个浏览器仅显示数据,该回显/恢复行为仍然存在于第一个浏览器中.数据正确存储在firebase中的唯一方法是,如果我一次只有一个浏览器使用它.
推荐指数
解决办法
查看次数
如何在Angularfire中的数组上设置键名
我正在使用Angularfire创建数组,但我无法设置密钥名称.Firebase会自动给我一个神秘的密钥(例如Jm9vLy8Lye-KS35KsmL),但我想把它自己设置为更有意义的东西.目前还不清楚我是如何在Angularfire中做到这一点的.我在$ firebaseArray上使用$ add方法:
var firebaseRef = new Firebase("https://firebase_location");
$scope.messages = $firebaseArray(firebaseRef);
$scope.messages.$add(
{
FirstName: patient.FirstName,
LastName: patient.LastName
}
).then(function(firebaseRef) {
var id = firebaseRef.key();
});
数据存储得很好,我可以在仪表板上看到它.但是,id始终是一个神秘的火力值.我希望能够将自己设定为有意义的东西.在我的情况下,个别患者的ID将是有意义的...
有什么想法吗？
谢谢!
推荐指数
解决办法
查看次数
来自Facebook的$ authWithOAuthRedirect后,Firebase $ onAuth的authData错误
我正在尝试使用Facebook登录验证我的Firebase(Angularfire)应用程序的用户.
当我使用弹出窗口进行身份验证时,一切都按预期工作,但是为了支持尽可能多的浏览器(iOS上的Chrome不支持弹出窗口,例如)我想要使用重定向($authWithOAuthRedirect)进行身份验证.
我已经确认我在Facebook上的设置是正确的(我的应用程序ID和秘密,例如)但是当我通过重定向进行Facebook身份验证后重定向回我的应用程序,$onAuth但是我没有我的Facebook authData.
相反,我有匿名authData.有点背景; 所有用户如果未经过其他身份验证,则匿名进行身份验证(例如,使用Facebook).
我看不出为什么会这样 - 用户现在应该通过Facebook验证,并拥有Facebook authData.
在某些情况下,我的代码的例外情况如下:
用户单击登录按钮时触发
function logIn () {
firebaseAuth
.$authWithOAuthRedirect('facebook', function (error) {
if (error) {
console.log(error);
}
});
}
$onAuth(在我的Angular应用程序中run)
function run ($rootScope, firebaseAuth, sessionStore) {
$rootScope
.$on('$routeChangeError', function (event, next, prev, error) {
if (error === 'AUTH_REQUIRED') {
console.log(error);
}
});
$rootScope
.$on('$routeChangeSuccess', function (event, current, prev) {
$rootScope.title = current.$$route.title;
});
firebaseAuth
.$onAuth(onAuth);
function onAuth (authData) {
console.log(authData); …推荐指数
解决办法
查看次数
Angular2中的嵌套Observable使用AngularFire2不在视图中渲染
我正在构建一个使用Firebase和AngularFire2(目前处于alpha版)的实验性(Ionic 2)应用程序.为此,我将遵循Aaron Saunders的教程作为基础:
http://www.clearlyinnovative.com/integrating-firebase-with-angularfire2-into-angular2-ionic2-part-2 https://github.com/aaronksaunders/ionic2-angularfire-sample
以下是我的home.ts和我的home.html.
this.projects = af.list('/items').map( (items) => {
return items.map( item => {
item.meta = af.object(`/item_meta/${item.$key}`)
return item
})
})
以下演示文稿演示了AngularFire2嵌套Observables返回的方法:https://youtu.be/ngnSOTSS8Q8？t = 1h6m37s
这是我的观点:
<ion-card *ngFor="#item of items | async">
<ion-card-header>
{{item.name}}
</ion-card-header>
<ion-card-content>
{{item.description}}
<br>
{{item.meta.stockPrice | async}}
</ion-card-content>
</ion-card>
与我所遵循的演示中的示例的主要区别在于,我在'list/array'Observable中嵌套了一个'对象'Observable.相反,他们在列表中添加一个列表.这样做的结果是我试图直接在我的视图中渲染{{item.meta.stockPrice}}而不是嵌套ngFor.
这就是我的数据:
{
"items":
{
"item1":{
"name": "Item 1",
"description": "1234"
},
"item2":{
"name": "Item 2",
"description": "abcd"
}
}
"items_meta"{
"item1":{
"stockPrice": 1234,
"moarData": "derp"
},
"item2":{
"stockPrice": 386,
"moarData": "lolz"
} …推荐指数
解决办法
查看次数
使用AngularFire 2更新FirebaseListObservable中的项目
我正在尝试使用Angularfire2 更新Angular2项目中FirebaseListObservable对象中的项目.FirebaseListObservable的定义如下:
export declare type FirebaseOperation = string | firebase.database.Reference | firebase.database.DataSnapshot | AFUnwrappedDataSnapshot;
export declare class FirebaseListObservable<T> extends Observable<T> {
_ref: firebase.database.Reference | firebase.database.Query;
constructor(_ref: firebase.database.Reference | firebase.database.Query, subscribe?: <R>(subscriber: Subscriber<R>) => Subscription | Function | void);
lift<T, R>(operator: Operator<T, R>): Observable<R>;
push(val: any): firebase.database.ThenableReference;
update(item: FirebaseOperation, value: Object): firebase.Promise<void>;
remove(item?: FirebaseOperation): firebase.Promise<void>;
_checkOperationCases(item: FirebaseOperation, cases: FirebaseOperationCases): firebase.Promise<void>;
}
我有一个显示,保存,删除和更新房屋的服务,如下所示:
@Injectable()
export class HousesService {
private _houses$:FirebaseListObservable<IHouse[]>;
constructor(private af:AngularFire) {
this._houses$ = this.af.database.list('/houses');
}
save(house:IHouse) {
if …推荐指数
解决办法
查看次数
AngularFire 2.0.1中抛出了auth/web-storage-unsupported错误
当我尝试使用带有诺基亚Lumia 520电话的"firebase-auth/web-storage-unsupported"的firebase身份验证登录我的网站时,会抛出错误代码.我正在使用AngularFire 2.0.1.有什么方法我可以解决这个问题,因为我的一些用户仍然使用旧版本的Internet Explorer这些手机.
推荐指数
解决办法
查看次数
Firebase'bygerTransferred':属性'bytesTransferred'在'Object'类型上不存在
我在用什么
- 角
- 火力地堡
是)我有的
- 上传服务,允许我上传到firebase存储和实时数据库
- 这已经好几周了
问题
今天早上它不起作用.
我没有改变任何与这个文件或它的组件有关的事情
我唯一改变的是firebase npm install来尝试让其他一些废话工作
这完全阻止了我的项目
我的服务现在显示构建错误:
[ts]属性'bytesTransferred'在'Object'类型上不存在
[ts]'对象'类型中不存在属性'totalBytes'.
类型'()=> void'的参数不能分配给'Unsubscribe'类型的参数.类型'void'不能分配给'undefined'类型.
问题
- 有谁知道为什么突然显示这个错误信息？
我的上传服务
import { Injectable, OnDestroy } from '@angular/core';
import { Upload } from './upload';
import { AngularFireDatabase, FirebaseListObservable, FirebaseObjectObservable } from 'angularfire2/database';
import * as firebase from 'firebase';
import { AuthService } from '../../user/auth.service';
import { Subscription } from 'rxjs/Subscription';
// Routes
import { Router, ActivatedRoute } from '@angular/router';
@Injectable()
export class ProjectsAddService implements OnDestroy {
private _subscription: Subscription;
private …推荐指数
解决办法
查看次数
如何在angularfire2/auth signOut之后断开与Google身份验证的连接？
我正在使用Angular和Firebase构建一个网站.我正在使用Angularfire2和AngularFireAuth库以及GoogleAuthProvider(Google)作为我的身份验证提供程序.
这是我的服务代码:
import { Injectable } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import { AngularFireAuth } from 'angularfire2/auth';
import * as firebase from 'firebase/app';
@Injectable()
export class AuthenticationService {
user: Observable<firebase.User>;
constructor(public afAuth: AngularFireAuth) {
this.user = afAuth.authState;
}
login() {
this.afAuth.auth.signInWithPopup(new firebase.auth.GoogleAuthProvider());
}
logout() {
this.afAuth.auth.signOut();
}
}
当用户"退出"我的网站时,它可以正常工作,但似乎可以"缓存"Google身份验证.因此,当他们第二次尝试登录时,我遇到了一些问题:
- 用户不得选择其他Google帐户登录.
- 用户自动登录...这似乎是一个安全问题.另一个用户可以访问相同的共享PC,并以前一个用户身份登录,并且不需要输入密码来执行此操作.
我究竟做错了什么？有没有办法可以阻止angularfire2/auth缓存这些凭据？有没有办法在用户退出我的网站时将用户退出Google？
firebase angularfire firebase-authentication angularfire2 angular
推荐指数
解决办法
查看次数
更改路线后数据消失
改变路线后我的数据消失了.
场景:
CommentComponent(显示数据) - > ChangeRoute - > CommentComponent(未显示数据)
数据仅在第一次加载时显示,但每当我更改路径时它就会消失.
我发现这个问题与我的案例/问题类似: 使用routerlink后没有FireStore的数据
但是没有一条评论/答案是有帮助的.所以我决定提出这个问题.
COMPONENT.HTML comment.component.html::
<ng-template #noComments>
<h1>No comment yet.</h1>
</ng-template>
<div *ngIf="comments?.length > 0; else noComments">
<h1 style="margin-bottom: 3.5vh;">Comments</h1>
<ul *ngFor="let comment of comments">
<li>
<mat-card>
<h3>{{comment.name}}</h3>
<p>{{comment.comment}}</p>
</mat-card>
</li>
</ul>
</div>
COMPONENT.TypeScript comment.component.ts::
import { Component, OnInit } from '@angular/core';
import { AngularFirestore, AngularFirestoreCollection, AngularFirestoreDocument } from 'angularfire2/firestore';
import { Observable } from 'rxjs/Observable';
import { CommentService } from '../services/comment.service';
import { Comment } from '../models/comment'; …推荐指数
解决办法
查看次数
标签 统计
angularfire ×10
firebase ×7
angular ×5
angularjs ×4
angularfire2 ×1
facebook ×1
ionic2 ×1
javascript ×1
jshint ×1
oauth ×1
observable ×1