[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 查询条件,以获取不同 ...
随机推荐
- Shell中反引号(`)与$()用法的区别
今天有人提问: echo `echo \\\\\\\w` echo $(echo \\\\\\\w) 为什么输出的不一样? 这就引申出了另一个问题:反引号与$()有没有区别? 这是一个非常有意思的问题 ...
- 1.15 Python基础知识 - 函数
函数是可重用的程序代码段. 一.函数的声明和调用 声明格式: def 函数名([形参列表]): 函数体 调用格式: 函数名([实参列表]) 函数名:是一种标识符,命名规则为全小写字母,可以使用下划线增 ...
- 几个移动web app开发框架
几个移动web app开发框架 一.总结 1.有amaze ui,有app.js(登录注册界面用到的) 二.几个移动web app开发框架 jQuery Mobile jQuery Mobile框架 ...
- Costura.Fody
使用Costura.Fody将源DLL合并到目标EXE 本文为原创文章,如转载,请在网页明显位置标明原文名称.作者及网址,谢谢! 一.本文主要是使用Costura.Fody工具将源DLL合并到目标EX ...
- iOS_07_流程控制
一.流程控制 * 顺序结构:默认的流程结构.按照书顺序执行每一条语句. * 选择结构:对给定得条件进行判断,再根据判断结果来决定执行哪一段代码. * 循环结构:在给定条件成立的情况下,反复执行某一段代 ...
- python3 pygame 坦克自动移动
让坦克自动跑起来 这里需要一个坦克的图. 放到与脚本同一目录. 好,我们就让这个坦克自动跑. 下面上代码: # !/usr/bin/env python # -*- coding:utf-8 -*- ...
- (素材源代码) 猫猫学IOS(五)UI之360等下载管理器九宫格UI
猫猫分享,必须精品 先看效果 代码学习地址: 猫猫学IOS(五)UI之360等下载管理器九宫格UI 猫猫学IOS(五)UI之360等下载管理器九宫格UI http://blog.csdn.net/u0 ...
- Swift语言之View,Button控件实现小方块在界面上的移动(纯代码实现)
import UIKit class ViewController: UIViewController { var diamonds:UIView! var diamondsXY = CGRectMa ...
- Scala基础知识
1.scala的变量分为可变变量和不可变变量 不可变变量: val hello = "helloworld" 可变变量的定义方法 var str2 = "我是kw!&qu ...
- 自定义npm包——typeScript版本
前言 这篇文章是在我之前的文章 [自定义npm包的创建.发布.更新和撤销] 的基础上做的扩展,主要是针对如何创建以及发布一个typeScript语言的npm包. 大纲 1.创建关于typeScript ...