DOM in Angular2
<elementRef>
import {ElementRef} from "@angular/core";
constructor(private element: ElementRef) {
// now, we can reference to: this.element
}
this.element.nativeElement('.js-banner-container'),
Provides access to the underlying native element (DOM element).
import {AfterContentInit, Component, ElementRef} from '@angular/core';
@Component({
selector: 'app',
template: `
<h1>My App</h1>
<pre style="background: #eee; padding: 1rem; border-radius: 3px; overflow: auto;">
<code>{{ node }}</code>
</pre>
`
})
export class App implements AfterContentInit {
node: string;
constructor(private elementRef: ElementRef) {
}
ngAfterContentInit() {
const tmp = document.createElement('div');
const el = this.elementRef.nativeElement.cloneNode(true);
tmp.appendChild(el);
this.node = tmp.innerHTML;
}
}
参考这篇 Angular 2: @Directive() 指令创建无限滚动
DOM in Angular2的更多相关文章
- Angular2新人常犯的5个错误
看到这儿,我猜你肯定已经看过一些博客.技术大会录像了,现在应该已经准备好踏上angular2这条不归路了吧!那么上路后,哪些东西是我们需要知道的? 下面就是一些新手常见错误汇总,当你要开始自己的ang ...
- Angular2学习笔记(1)
Angular2学习笔记(1) 1. 写在前面 之前基于Electron写过一个Markdown编辑器.就其功能而言,主要功能已经实现,一些小的不影响使用的功能由于时间关系还没有完成:但就代码而言,之 ...
- Angular杂谈系列1-如何在Angular2中使用jQuery及其插件
jQuery,让我们对dom的操作更加便捷.由于其易用性和可扩展性,jQuer也迅速风靡全球,各种插件也是目不暇接. 我相信很多人并不能直接远离jQuery去做前端,因为它太好用了,我们以前做的东西大 ...
- Angular2开发笔记
Problem 使用依赖注入应该注意些什么 服务一般用来做什么 指令一般用来做什么 angular2如何提取公共组件 angular2为什么不需要提公共组件 父组件与子组件之间如何通讯 什么时候应该使 ...
- Angular2学习笔记——NgModule
在Angular2中一个Module指的是使用@NgModule修饰的class.@NgModule利用一个元数据对象来告诉Angular如何去编译和运行代码.一个模块内部可以包含组件.指令.管道,并 ...
- 最新Angular2案例rebirth开源
在过去的几年时间里,Angular1.x显然是非常成功的.但由于最初的架构设计和Web标准的快速发展,逐渐的显现出它的滞后和不适应.这些问题包括性能瓶颈.滞后于极速发展的Web标准.移动化多平台应用, ...
- angular2系列教程(五)Structural directives、再谈组件生命周期
今天,我们要讲的是structural directives和组件生命周期这两个知识点.structural directives顾名思义就是改变dom结构的指令.著名的内建结构指令有 ngIf, n ...
- angular2系列教程(四)Attribute directives
今天我们要讲的是ng2的Attribute directives.顾名思义,就是操作dom属性的指令.这算是指令的第二课了,因为上节课的components实质也是指令. 例子
- angular2系列教程(三)components
今天,我们要讲的是angualr2的components. 例子
随机推荐
- UVa 1645 Count(**)
题目大意:输入n,统计有多少个n个结点的有根树,使得每个深度中所有结点的子结点数相同.结果模1000000007. 思路:根据题意,每个结点的每个子树都是相同的.所以n结果为n-1的所有约数的结果加起 ...
- PHPBB 学习
Fixing incorrect cookie settings 设置PHPBB的cookie
- dedecms自定义函数(二次开发)
一些功能可能dedecms没有,这个时候可以自己写一些函数: 1.打开inlude->extend.func.php,将函数写到里面 比如:前台: [field:id function=&quo ...
- c# 远程监控(2) 摄像头调研及模拟
经过N多调研,最终选择了OpenCV(Emgu CV) ** 至于DirectShow, OpenCV等等其他大家可以百度,在这里我就不再赘述 环境:vs2010 vs2012 vs2013均可 Op ...
- http请求之referer头与防盗链
在网页中的占用大流量的信息可以写成这个信息在网络上的url位置,这样就会减少本网站的流量,但是其他网站也 不会随意让你使用人家的资源,因为这样的情对人家的网站没有好处,会增加人家网站的流量,所以要防止 ...
- 分析Redis架构设计
http://blog.csdn.net/a600423444/article/details/8944601 一.前言 因为近期项目中开始使用Redis,为了更好的理解Redis并应用在适合的业务场 ...
- Java简单算法--求100以内素数
package cn.magicdu.algorithm; /** * 打印素数 * * @author xiaoduc * */ public class Prim { public static ...
- 如何入侵Linux操作系统
我发现了一个网站,于是常规入侵.很好,它的FINGER开着,于是我编了一个SHELL,aaa帐号试到zzz(by the way,这是我发现的一个网上规律,那就是帐号的长度与口令的强度成正比, 如果一 ...
- UITableViewCell左滑的时候添加多个按钮的方法(iOS8+)以及UIRefreshControl(iOS6+)的使用。
之前想在cell左滑的时候添加更多的按钮而不是只有‘删除’按钮如下所示,貌似不是一件简单的事.但是现在只要实现几个方法就行了. 代码写的比较垃圾,重在理解这个知识.. . 具体代码: // // T ...
- eclipse下的tomcat内存设置大小
在eclipse中设置,居然可以了, 设置步骤如下: 1.点击eclipse上的debug图标旁边的下拉箭头 2.然后选择Run Configurations, 3.系统弹出设置tomcat配置页面, ...