[Angular 2] Rendering an Observable with the Async Pipe
Angular 2 templates use a special Async pipe to be able to render out Observables. This lesson covers the syntax used to create an Observable in Angular 2 and then to render it out in the template.
import {Component} from 'angular2/core';
import {bootstrap} from 'angular2/platform/browser';
import {Observable} from 'rxjs/Observable';
import 'rxjs/add/observable/interval'
@Component({
selector: 'app',
template: `<h1>{{clock | async}}</h1>`
})
class App {
clock = Observable.interval();
}
bootstrap(App);
[Angular 2] Rendering an Observable with the Async Pipe的更多相关文章
- [Angular 2] Rendering an Observable Date with the Async and Date Pipes
Instead of simply pushing numbers on a timer into the template, now we'll move on to pushing actual ...
- [Angular 2] Passing Observables into Components with Async Pipe
The components inside of your container components can easily accept Observables. You simply define ...
- [Angular] Bind async requests in your Angular template with the async pipe and the "as" keyword
Angular allows us to conveniently use the async pipe to automatically register to RxJS observables a ...
- [Angular 2] Controlling Rx Subscriptions with Async Pipe and BehaviorSubjects
Each time you use the Async Pipe, you create a new subscription to the stream in the template. This ...
- [Angular] Show a loading indicator in Angular using *ngIf/else, the as keyword and the async pipe
The network may be unreliable and loading data may take time. Thus it is important to give the user ...
- [Angular] Pluck value from Observable
export class MailFolderComponent implements OnInit{ title: Observable<string>; messages: Obser ...
- Angular 学习笔记 ( timezone + moment + material date-picker + date pipe + asp.net core )
参考 : https://stackoverflow.com/questions/29979609/time-conversion-with-timezoneinfo-for-past-years h ...
- [Angular 2] Filter items with a custom search Pipe in Angular 2
This lessons implements the Search Pipe with a new SearchBox component so you can search through eac ...
- [Angular 2] Handle Reactive Async opreations in Service
When you use ngrx/store and you want to fire a service request. When it sucessfully return the respo ...
随机推荐
- iOS 上传项目常见问题
一. Archive项目 时,出现"Your build settings specify a provisioning profile with the UUID "XXX&qu ...
- php 与 ajax 获取123的案例
同事问我,咱们从数据库里面获取数据,用ajax的方式展示到前台页面.啥都不说了,动手写个案例吧. 1,建立一个页面: <!DOCTYPE html PUBLIC "-//W3C//DT ...
- jquery学习(2)toggle
$(function(){ $("#panel h5.head").hover(function(){ //交替执行该函数 $(this).next().show(); },fun ...
- python:UnboundLocalError: local variable 'xxx' referenced before assignment
近来一直都在学习python语言,偶然在伯乐在线看到2017年京东C/C++的面试题.就打算用python+ST3 IDE顺便敲下面试题代码. 原题 C语言: #include <stdio.h ...
- HDU 2955(01背包问题)
M - 01背包 Time Limit:1000MS Memory Limit:32768KB 64bit IO Format:%I64d & %I64u Descript ...
- UI基础 - UILabel
//根据文字获取size - (CGSize)getSizeWithstring:(NSString *)string { CGSize maxSize = CGSizeMake(320, 320); ...
- 转:Zend Framework 2.0 分析
文章来自于:http://bbs.phpchina.com/thread-268362-1-1.html ZF2已经发布,与ZF1相比,MVC这一模块内部的实现机制可谓大相径庭,许多用过ZF1的PHP ...
- (未解决)问题记录ionic android 签名之后安装到手机上点击运行出现闪退,不签名运行正常
Log日志如下: - ::): error opening trace ) - ::): FATAL EXCEPTION: main - ::): java.lang.RuntimeException ...
- Windows 7 mklink命令详解
mklink是Windows 7下的一个类似于linux下In的命令,其作用是在NTFS文件系统中创建文件或目录的链接(类似于桌面快捷方式).如果加以利用其发挥的作用是非常的大的,不仅可以帮助我们节省 ...
- 关于索引degree设置的问题
--并行查询 可以使用并行查询的情况 1. Full table scans, full partition scans, and fast full index scans 2. Index ful ...