我使用angularfire2在angular2应用程序中有一个异步的消息列表.
<message *ngFor="let message of messages | async" [message]="message"></message>
Run Code Online (Sandbox Code Playgroud)
当列表更新时,ngFor中的所有元素似乎都会重新渲染.是否可以重新渲染列表中的新项目?
我正在尝试将a firebase.Promise转换为Observable使用angular-cli生成的项目.
在这里它说,firebase.Promise可以兼容Native Promise和Promise/A+实施.
但是当我尝试使用Observable.fromPromise()rxjs 的方法时出现错误.
Argument of type 'firebase.Promise<any>' is not assignable to parameter of type 'Promise<any>'.
Types of property 'then' are incompatible.
Type '(onResolve?: (a: any) => any, onReject?: (a: Error) => any) => Promise<any>' is not assignable to type '{ <TResult1, TResult2>(onfulfilled: (value:
any) => TResult1 | PromiseLike<TResult1>, onrejected:...'.
Type 'firebase.Promise<any>' is not assignable to type 'Promise<any>'.
Run Code Online (Sandbox Code Playgroud)
它实际上工作,但有错误令人讨厌,任何关于如何以干净的方式避免这个错误的想法?
谢谢.
我有一个组件,您可以在其中输入一些搜索词,它将使用*ngFor循环过滤内容.问题是当我输入搜索词时,我需要点击屏幕以使更新生效.
以下是发生循环的html代码的一部分:
<li *ngFor="let item of posts | reverse; let i = index; ">
<div class="media" *ngIf="item.doesContainTags(searchTags)">
Run Code Online (Sandbox Code Playgroud)
在输入要搜索的标记的输入字段上执行的代码是:
updateSearchTags() {
event.stopPropagation();
// sorter is what is types into the search by tag input field
this.searchTags = this.sorter.split(',');
}
Run Code Online (Sandbox Code Playgroud)
这是post对象的静态函数:
doesContainTags(searchTags: string[]): boolean {
let array = this.tags.split(',');
if(!array || array.length === 0) {return false;}
if(!searchTags || searchTags.length === 0) {return false;}
for(let searchTag of searchTags){
if(array.indexOf(searchTag) === -1) {
} else {
return true;
}
}
return false;
}
Run Code Online (Sandbox Code Playgroud)
这是获取循环的帖子的代码: …
我有一个HospitalComponent试图显示医院列表的组件.它使用的readAll方法HospitalService(从firebase返回一个Observable):
ngOnInit() {
this.hospitalService
.readAll() // Make a firebase call
.subscribe(hospitals => this.hospitals = hospitals);
}
Run Code Online (Sandbox Code Playgroud)
路由/hospital已插入此组件HospitalComponent.每次我到达时/hospital,Angular 2都会创建一个新的HospitalComponent,并且新的呼叫将被发送给hospitalService.
每次到达时/hospital,医院名单都会延迟显示.
从服务构造函数本身检索医院列表是一种好习惯吗?这样,我可以从后台管理刷新列表,而不是有一些延迟.我会在组件中:
ngOnInit() {
this.hospitals = this.hospitalService.readAll();
}
Run Code Online (Sandbox Code Playgroud)
并在服务中:
constructor(private hospitalService: HospitalService) {
hospitalService.subscribe(hospitals => this.hospitals = hospitals);
}
Run Code Online (Sandbox Code Playgroud)
但这意味着要手动管理所有医院的变化.
我有一个 javascript 对象数组,如下所示。
jsObjFromCsv =
[
{
"J251525" : {
"APPROVER" : "TOM@MAIL.COM",
"JOB DESCRIPTION " : "CLEAN THE HOUSE",
"JOB NUMBER" : "J251525"
}
}, {
"J512912" : {
"APPROVER" : "JAMES@MAIL.COM",
"JOB DESCRIPTION " : "BRUSH HORSE",
"JOB NUMBER" : "J512912"
}
}, {
"J5-512" : {
"APPROVER" : "HARRY@MAIL.COM",
"JOB DESCRIPTION " : "WASH CAR",
"JOB NUMBER" : "J5-512"
}
}
]
Run Code Online (Sandbox Code Playgroud)
但是,当我使用以下代码保存到 firebase 时,它看起来像这样
saveJobToFirebase(jobs: Array<Object>) {
const jobCodesRef = this.af.database.list('/jobCodes/' + this.currentUser.company)
return jobCodesRef.push(jobs);
} …Run Code Online (Sandbox Code Playgroud) javascript firebase firebase-realtime-database angularfire2 angular
如何使用angularfire2一次执行多个对象推送?
仅推送一个对象数组不会为每个对象设置键.
this.af.database.list( '/symbols/').push(
{
typ :"symbol1", ....
}
);
this.af.database.list( '/symbols/').push(
{
typ :"symbol2", ....
}
);
Run Code Online (Sandbox Code Playgroud) javascript firebase firebase-realtime-database angularfire2 angular
使用 angularfire2 处理 Angular5 应用程序。我有一个包含大量项目的列表。当我使用以下方法订阅它时:
this.db.list("/list").valueChanges().subscribe(data => { .. });
Run Code Online (Sandbox Code Playgroud)
我按预期在数据中获取列表的所有子项。当我现在更改 Firebase 后端中的单个项目时,回调然后再次接收所有子项的整个列表。
如何订阅仅接收数据中列表的受影响项目?
还是因为 angularfire2 在内部处理列表的状态并且只将受影响的项目从服务器传输到应用程序而无关紧要?我的目标是最小化连接流量。
提前致谢 :)
我想查询 firestore 文档集合,并且只想使用angularfire2检索文档 ID ,以节省读取所有文档的成本。据我了解,以下代码也在检索所有文档,并导致对所有文档进行读取操作,无论我是否使用doc.data()。我对吗?
db.collection("cities").where("capital", "==", true).onSnapshot(function(querySnapshot) {
querySnapshot.forEach(function(doc) {
console.log(doc.id);
}
});
Run Code Online (Sandbox Code Playgroud)
所以在文档中是这样说的:
对于文档读取以外的查询,例如对集合 ID 列表的请求,您需要为一次文档读取付费。
angularfire2 有没有办法查询集合并仅检索文档 ID?
或者除了使用 angularfire2 之外还有其他方法吗?
firebase typescript angularfire2 angular google-cloud-firestore
我已更新Angular 5至Angular 6.现在我正在尝试更新我的代码以使其兼容RxJS 6.
.pipe(
map(job => job[0]),
switchMap((job) => {
return job ? this.bookingService.findByID(job.property.id) : Observable.empty();
}, (job: Job, bookings: Booking[]) => {
this.mark_jobs_unavailable(job, bookings);
return job;
})
)
Run Code Online (Sandbox Code Playgroud)
我正在收到有关使用switchMap的警告Deprecated Symbol is used.
这些是我的进口: import {map, switchMap} from 'rxjs/operators';
在v6中有没有其他方法可以使用switchMap?此外,如果我不更改我的代码rxjs-compat应该使我现有的代码工作(我已经安装)但我得到以下错误相同的代码,但在RxJS 5样式:
.map(job => job[0])
.switchMap((job) => {
return job ? this.bookingService.findByID(job.property.id) : Observable.empty();
}, (job: Job, bookings: Booking[]) => {
this.mark_jobs_unavailable(job, bookings);
return job;
})
Run Code Online (Sandbox Code Playgroud)
Error: Expected 1 argument …
当我更新到RxJS 6时,我的应用程序坏了。我可以正常使用它,但是这种方法让我很困惑。
以前,我们有一系列可观测的对象被flatMapped,然后像这样使用CombineLatest:
const newObservable = myArrayOfObservables
.flatMap(observables => {
return Observable.combineLatest(observables);
});
Run Code Online (Sandbox Code Playgroud)
我可以订阅newObservable并从其他所有列表中获取最新输出。
现在,我正在尝试执行以下操作:
const mergedList$ = chatList$.pipe(
mergeMap(res => {
return combineLatest(res);
}));
Run Code Online (Sandbox Code Playgroud)
这使我成为那些真正漫长而费解的人之一
类型'(res:Observable <{$ key:string;}> [])=> OperatorFunction <{},[{},Observable <{$ key:string; }>]>'不能分配给类型'(value:Observable <{$ key:string;}> [],index:number)=> ObservableInput <{}>'的参数。键入'OperatorFunction <{},[{},Observable <{$ key:string; }>]>'不能分配给类型'ObservableInput <{}>'。键入'OperatorFunction <{},[{},Observable <{$ key:string; }>]>”不能分配给“ Iterable <{}>”类型。类型'OperatorFunction <{},[{},Observable <{$ key:string;类型中缺少属性'[Symbol.iterator]'。}>]>'。
坦率地说,我的阅读障碍使我无法解析。
如果我只是在上面返回res,然后尝试
const mergeCombo = combineLatest(mergedList$);
Run Code Online (Sandbox Code Playgroud)
现在mergeCombo不是可观察的。相反,它是一个
OperatorFunction <{},[{},Observable <{$ key:string; }>]>
可能值得注意的是,我的原始可观察对象是由AngularFireObject.snapshotChanges()发出的
angularfire2 ×10
angular ×9
firebase ×8
rxjs ×4
javascript ×2
observable ×2
typescript ×2
angular5 ×1
angular6 ×1