[Angular] @ViewChild and template #refs to get Element Ref
We can use @ViewChild with component:
@ViewChild(AuthMessageComponent) message: AuthMessageComponent; //.... ngAfterContentInit() {
if (this.message) {
this.message.days = ;
}
}
By doing this, we actually can access component's prop and events.
If we want to get component DOM node, what we can do is using template ref.
<input type="email" name="email" ngModel #email>
@ViewChild('email') email: ElementRef; // .... ngAfterViewInit() {
console.log(this.email); // ElementRef
}
[Angular] @ViewChild and template #refs to get Element Ref的更多相关文章
- angular ViewChild ContentChild 系列的查询参数
官方说明 官方文档 在调用 NgAfterViewInit 回调函数之前就会设置这些视图查询. 元数据属性: selector - 用于查询的指令类型或名字. read - 从查询到的元素中读取另一个 ...
- [Angular 2] Create template with Params
Angular 2 templates have a special let syntax that allows you to define and pass a context when they ...
- [Angular 2] Passing Template Input Values to Reducers
Angular 2 allows you to pass values from inputs simply by referencing them in the template and passi ...
- Angular ViewChild
viewchild // 使用方法 git clone https://git.oschina.net/mumu-osc/learn-component.git cd learn-component ...
- [Angular] @ViewChild read custom directive and exportAs
For example we have a component: <Card ></Card> And a driective: <Card highlighted> ...
- [Angular] ViewChild 'read' option
It is not clear in the Docs about {read: xx} option for @ViewChild. Based on the Source code, @ViewC ...
- [Angular 2] Share Template Content In Another Template With Content Projection <ng-content>
Angular 1 provided a mechanism to place content from your template inside of another template called ...
- [Angular] Test component template
Component: import { Component, Input, ChangeDetectionStrategy, EventEmitter, Output } from '@angular ...
- Angular ViewChild & ViewChildren
基础 ViewChild ViewChild 装饰器用于获取模板视图中的元素或直接调用其组件中的方法.它支持 Type 类型或 string 类型的选择器,同时支持设置 read 查询条件,以获取不同 ...
随机推荐
- diff命令具体解释
diff命令參数: diff - 找出两个文件的不同点 总览 diff [选项] 源文件 目标文件 以下是 GNU所接受的 diff 的全部选项的概要. 大多数的选项有两个同样的名字,一个是单个的跟在 ...
- php的数据类型和变量的作用域
1)php支持例如以下所看到的的基本数据类型: Integer(整数).Float(浮点数).String(字符串).Boolean(布尔值).Array(数组).Object(对象),此外还有两个特 ...
- get_browser()用法
get_browser()用法 get_browser()函数是用来分析USER_AGENT的,它的执行方法是自动获取客户端的USER_AGENT,然后调用browscap.ini库进行分析得到结果 ...
- menuconfig_kconfig
这一节的主要内容: Menuconfig的操作 Kconfig和.config文件 Linux内核配置裁剪实验 linux编译器通过.config文件确认哪些代码编译进内核,哪些被裁减掉 menuco ...
- COdeVS——T 1082 线段树练习 3 (分块练习)
http://codevs.cn/problem/1082/ 时间限制: 3 s 空间限制: 128000 KB 题目等级 : 大师 Master 题解 题目描述 Descriptio ...
- (转)看懂类图——UML类图基础
类图 要学懂设计模式,就需要先看得懂类图,类与类之间的关系是学习设计模式的基础,而在软件工程中,类与类之间的关系是通过UML中的类图来体现. 这篇笔记包含的不会是类图的所有东西,包含的只是各个类之间的 ...
- python课程:python3的数字与字符串
一下是基于python2的教程的 python中有 多个数据类型,和,两种字符串类型 他们都是不可变的.
- ganglia错误解决
1. 运行: 解决: 这时重新启动gmetad,输入命令: service gmetad stop 显示: Shutting down GANGLIA gmetad: ...
- QT5.5
QT创建空项目时,会有报错“无法解析的外部符号”,方法是在 .pro文件中添加 以下,即可QT+=core gui widgets
- Android5.0(Lollipop) BLE蓝牙4.0+浅析demo连接(三)
作者:Bgwan链接:https://zhuanlan.zhihu.com/p/23363591来源:知乎著作权归作者所有.商业转载请联系作者获得授权,非商业转载请注明出处. Android5.0(L ...