使用Angular 2和AngularFire访问Firebase列表值

到目前为止，我已经能够将我的CRUD应用程序迁移到Firebase。我可以列出、创建和删除新闻。但我正在努力编辑

这是编辑组件。它获取路由参数的快照，该快照等于Firebase中该特定新闻的$key值。然后将其连接到数据库列表：

import { Component} from '@angular/core';
import { ActivatedRoute } from '@angular/router';
import { AngularFire, FirebaseListObservable } from 'angularfire2';

@Component({
  moduleId: module.id,
  selector: 'app-edit-news',
  templateUrl: 'edit-news.component.html',
  styleUrls: ['edit-news.component.css']
})
export class EditNewsComponent {
  noticia: FirebaseListObservable<any>;

  constructor(
    private route: ActivatedRoute,
    private af: AngularFire) { 
      this.news = af.database.list('news/'+this.route.snapshot.params['id']);
    }

}

从'@angular/core'导入{Component}；
从'@angular/router'导入{ActivatedRoute}；
从“angularfire2”导入{AngularFire，FirebaseListObservable}；
@组成部分({
moduleId:module.id，
选择器：“应用程序编辑新闻”，
templateUrl:'edit news.component.html'，
样式URL:['edit-news.component.css']
})
导出类EditNewsComponent{
注：可观察到火基清单；
建造师(
专用路由：激活的路由，
二等兵af:AngularFire）{
this.news=af.database.list（'news/'+this.route.snapshot.params['id']）；
}
}

---

我对可观测事物还不熟悉，但我认为通过这种方法，我可以使用插值来访问数据库的具体对象，比如我们

{{news.title}

，显然，我错了。有任何帮助吗？

在html模板中供EditNewsComponent使用

{{(news | async)?.title}}    // you don't need '?' if it can't be null

也许你也需要改变

this.news = af.database.list('news/'+this.route.snapshot.params['id']);

到

---

这样您就可以访问对象而不是列表

在用于EditNewsComponent的html模板中使用

{{(news | async)?.title}}    // you don't need '?' if it can't be null

也许你也需要改变

this.news = af.database.list('news/'+this.route.snapshot.params['id']);

到

这样您就可以访问对象而不是列表

使用这种语法

noticia: firebaseListObservable<any[]>;
constructor(private db: AngularFireDatabase,public af:AngularFireAuth) {
     this.noticia = db.list('/news',{
       query: {
          orderByChild:'id'
              }
     });
   }

noticia:firebaseListObservable；
构造函数（私有数据库：AngularFireDatabase，公共af:AngularFireAuth）{
this.noticia=db.list（“/news”{
查询：{
orderByChild:“id”
}
});
}

使用此语法

noticia: firebaseListObservable<any[]>;
constructor(private db: AngularFireDatabase,public af:AngularFireAuth) {
     this.noticia = db.list('/news',{
       query: {
          orderByChild:'id'
              }
     });
   }

noticia:firebaseListObservable；
构造函数（私有数据库：AngularFireDatabase，公共af:AngularFireAuth）{
this.noticia=db.list（“/news”{
查询：{
orderByChild:“id”
}
});
}

能否提供模板中使用news observable的部分？我有一种感觉，您没有在ngfor调用中添加异步管道。例如*ngFor=“let item of items | async”@Yevgeniy.Chernobrivets没有迭代。它只是一个表单，它从数据库中获取多个新闻值，输入值为

[（ngModel）]=“news.foo”

，您可以编辑它们并保存更改。我提到的插值只是一个访问值的例子。你能提供模板中使用news observable的部分吗？我有一种感觉，您没有在ngfor调用中添加异步管道。例如*ngFor=“let item of items | async”@Yevgeniy.Chernobrivets没有迭代。它只是一个表单，它从数据库中获取多个新闻值，输入值为

[（ngModel）]=“news.foo”

，您可以编辑它们并保存更改。我提到的插值只是一个获取值的例子。是的。。。我把它改成了object。我的错误。但问题仍然存在。如何使用

[（ngModel）]

而不是使用插值语法将这些对象值绑定到输入节点？我需要能够编辑和保存现有的新闻毕竟。谢谢！是 啊我把它改成了object。我的错误。但问题仍然存在。如何使用

[（ngModel）]

而不是使用插值语法将这些对象值绑定到输入节点？我需要能够编辑和保存现有的新闻毕竟。谢谢！