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的更多相关文章

  1. angular ViewChild ContentChild 系列的查询参数

    官方说明 官方文档 在调用 NgAfterViewInit 回调函数之前就会设置这些视图查询. 元数据属性: selector - 用于查询的指令类型或名字. read - 从查询到的元素中读取另一个 ...

  2. [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 ...

  3. [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 ...

  4. Angular ViewChild

    viewchild // 使用方法 git clone https://git.oschina.net/mumu-osc/learn-component.git cd learn-component ...

  5. [Angular] @ViewChild read custom directive and exportAs

    For example we have a component: <Card ></Card> And a driective: <Card highlighted> ...

  6. [Angular] ViewChild 'read' option

    It is not clear in the Docs about {read: xx} option for @ViewChild. Based on the Source code, @ViewC ...

  7. [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 ...

  8. [Angular] Test component template

    Component: import { Component, Input, ChangeDetectionStrategy, EventEmitter, Output } from '@angular ...

  9. Angular ViewChild & ViewChildren

    基础 ViewChild ViewChild 装饰器用于获取模板视图中的元素或直接调用其组件中的方法.它支持 Type 类型或 string 类型的选择器,同时支持设置 read 查询条件,以获取不同 ...

随机推荐

  1. js 数组操作大集合

    js数组的操作 用 js有非常久了,但都没有深究过js的数组形式.偶尔用用也就是简单的string.split(char).这段时间做的一个项目.用到数组的地方非常多.自以为js高手的自己竟然无从下手 ...

  2. 《ZigBee Wireless Networking》学习笔记【1】

    <ZigBee Wireless Networking>这本书对ZigBee技术阐释地比較全面,强烈推荐各位同仁阅读. 这本书的电子版请点击以下链接下载: 1,下图是该书中对ZigBee, ...

  3. JQuery的index()函数

    1.index(),这里的索引从0开始计数. jQueryObject.index( [ object ] ):1.1 如果没有指定参数object,则返回当前元素在其所有同辈元素中的索引位置.1.2 ...

  4. Android实践 -- 对apk进行系统签名

    对apk进行系统签名 签名工具 网盘下载 ,需要Android系统的签名的文件 platform.x509.pem 和 platform.pk8 这个两个文件在Android源码中的 ./build/ ...

  5. .netcore下的微服务、容器、运维、自动化发布

    原文:.netcore下的微服务.容器.运维.自动化发布 微服务 1.1     基本概念 1.1.1       什么是微服务? 微服务架构是SOA思想某一种具体实现.是一种将单应用程序作为一套小型 ...

  6. SQL Server 中计算农历

    1.建一表,放初始化资料   因为农历的日期,是由天文学家推算出来的,到现在只有到2049年的,以后的有了还可以加入!   CREATE TABLE SolarData ( yearId int no ...

  7. vue 用 :style动态修改带中划线的样式属性

    今天在项目中遇到要用:style动态设置margin-top值,直接写发现报错.后来改成驼峰就成功了,记录一下 错误示范: <div class="testLeft ulData&qu ...

  8. 《机器学习实战》---第二章 k近邻算法 kNN

    下面的代码是在python3中运行, # -*- coding: utf-8 -*- """ Created on Tue Jul 3 17:29:27 2018 @au ...

  9. stm32的串口中断

    下面有很多问题没有验证: 在设置USART_CR1中的TE位时,会发送一个空闲帧作为第一次数据发送, 目前我所了解的串口中断发送,有两种方式: 一个是:TC 一个是:TXE 这是判断两个标志位, 第一 ...

  10. 关于C语言的书

    我想横着走,,哈哈哈哈