我目前正在使用Google Firebase的新Firestore在学习角度的同时创建一个新应用。我的应用程序当前创建一个名为Links的集合,并创建一个具有自定义ID的新文档,该自定义ID在用户添加链接(即shorturl)时生成,该文档中包含4个字段:
我希望应用程序查询url字段中文档内的数据。
我已经创建了正确文档的路径:
linkCollection: Observable<{}>;
constructor(private afs: AngularFirestore, private router: Router) {
this.path = this.router.url.replace('/','');
afs.collection('Links').doc(this.path).valueChanges();
}
Run Code Online (Sandbox Code Playgroud)
这可能是一个简单的解决方案,但我不确定如何获取url字段。我拥有的代码能够检索该文档,并且在另一部分中使用类似的方法来检索所有想法,并使用* ngFor显示数据,但不确定如何在ts文件而不是模板中进行操作。
firebase angularfire2 angular google-cloud-firestore angularfire5
我正在Angular4中开发一个简单的待办事项应用程序.我通过以下方式设置应用程序:
表单组件:这是将项目添加到待办事项列表的表单
项目组件:这是单个组件.
应用程序组件:我有一个*ngFor看这里将列出所有待办事项.
我在项目组件上添加了一个新按钮,该按钮应该删除项目,但我无法弄清楚如何"找到"或"找到"项目的正确索引号以拼接或过滤掉它.
我在这里包含了一个github存储库的链接
app.component.html:
<app-navbar></app-navbar>
<div class="container">
<app-form (itemAdded)="onItemAdded($event)"></app-form>
<div class="row">
<div class="col-md-3 mb-3"
*ngFor="let item of toDoList; let i=index">
<app-item
[listItem]="item"
(itemDeleted)="onItemDeleted($event)"></app-item>
</div>
</div>
</div>
Run Code Online (Sandbox Code Playgroud)
app.component.ts:
import { Component } from '@angular/core';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent {
toDoList = [
{
name: 'Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.'
}
];
onItemAdded(itemData: {itemName: string}){
this.toDoList.push({ …Run Code Online (Sandbox Code Playgroud)