Angular2中的metadata(元数据)
@Attrubute()
从host element 中获得普通(不是@Input)属性对应的值
适用于组件嵌套或指令, 从父组件向子组件传递数据
app.component.ts
import {Component} from '@angular/core'import {Child} from './child'@Component({
selector: 'App',
directives:[Child],
template: `
<h1>App</h1>
<child content="content"></child>
`
})
export class App {
public content:string = '哈哈,我是自定义属性'
}
child.ts
import {Component,Attribute} from '@angular/core';
@Component({
selector: 'child',
template: `
<h1>Child {{content}}</h1>
`
})
export class Child {
constructor(@Attribute('content') content:string) {
console.log(content);
}
}
@Injectable()
标记,用来创建一个服务
import {Injectable} from '@angular/core'
@Injectable()
export class Service{
}
@Inject()
用来指定一个依赖
@Inject(Token) 注入Token对应的实例
@Inject() 则表示根据typescript对应的类型注入
import {Component,provide,Inject} from '@angular/core';
class Service {
url:';
}
@Component({
selector: 'App',
providers: [provide(", {useClass: Service})],
template: `
<h1>App</h1>
`
})
export class App {
constructor(@Inject('kittencup') service:Service) {
console.log(service.url);
}
}
@Optional()
表示依赖是可选的,如果依赖不存在不会报错
import {Component,provide,Inject,Optional} from '@angular/core';
@Component({
selector: 'App',
template: `
<h1>App</h1>
`
})
export class App {
constructor(@Optional() @Inject('testService') service:any) {
console.log(service);
}
}
Angular2中的metadata(元数据)的更多相关文章
- MetaData元数据
一.基础 定义:数据库.表.列相关信息的描述. 何时使用:想取得对数据库的信息时使用. 一]数据库元数据——通过DataBaseMetaData DataBaseMe ...
- Impala 中invalidate metadata和refresh
首先了解一下:Impala如何融入Hadoop生态系统 Impala使用了Hadoop生态系统中许多熟悉的组件.Impala可以作为消费者和生产者与其他Hadoop组件交换数据,因此它可以以灵活的方式 ...
- Spring 中的 MetaData 接口
什么是元数据(MetaData) 先直接贴一个英文解释: Metadata is simply data about data. It means it is a description and co ...
- Angular杂谈系列1-如何在Angular2中使用jQuery及其插件
jQuery,让我们对dom的操作更加便捷.由于其易用性和可扩展性,jQuer也迅速风靡全球,各种插件也是目不暇接. 我相信很多人并不能直接远离jQuery去做前端,因为它太好用了,我们以前做的东西大 ...
- android开发中获取<meta-data>数据
在 AndroidManifest.xml 中,<meta-data>元素是一个键值对,往往被包含在<application> .<activity>.<se ...
- 如何在Angular2中使用Forms
在Angular2中形成两个基本对象是Control和ControlGroup. 控制用户输入 Control 一个控制表示一个输入字段(ngFormControl) 一个控制可以绑定到一个input ...
- Android中<meta-data>的使用
在AndroidManifest.xml中.<meta-data>元素能够作为子元素,被包括在<activity>.<application> .<servi ...
- Angular2中Input和Output
@Input @Input是用来定义模块的输入的,用来让父模块往子模块传递内容: @Output 子模块自定义一些event传递给父模块用@Output. 对于angular2中的Input和Outp ...
- SpreadJS 在 Angular2 中支持哪些事件?
SpreadJS 纯前端表格控件是基于 HTML5 的 JavaScript 电子表格和网格功能控件,提供了完备的公式引擎.排序.过滤.输入控件.数据可视化.Excel 导入/导出等功能,适用于 .N ...
随机推荐
- KFC数据测试hbase结果
两个field,一个是KFC数据 一个列放的内容是“same” 每条数据都flush SLF4J: Failed to load class "org.slf4j.impl.Static ...
- IDEA 升级14.1提示org/hibernate/build/gradle/publish/auth/maven/AuthenticationManager:Unsupported major.minor version 51.0
在看到“Unsupported major.minor version 51.0”这样的错误描述时,就基本可以肯定是jdk版本不正确导致.但是提示的类非业务系统,而是来自IDEA.因此去其官网检索了下 ...
- XMPP协议、IM、客户端互联详解
导读 对于推送,IM服务器,目前可以使用一些厂家提供的SDK来实现,但是我们的老板又总是担心使用别人的SDK,假如别人的服务出现问题,或者别人偷看咱们的信息,那岂不是出现很大问题了 聊一聊xmpp的服 ...
- GCC 编译选项(转)
转:http://www.cnblogs.com/xmphoenix/archive/2011/03/21/1989944.html gcc提供了大量的警告选项,对代码中可能存在的问题提出警 告,通常 ...
- iOS 超 Easy 实现 渐变导航栏
接着上周的项目, 在上周我别出心裁的在自定义TabbarController中加入了自定义转场动画, 受到了大家广泛的喜爱, 再次表示感激, 今天我们继续实现LifestyleViewControll ...
- Jquery 扩展方法
$.fn是指jquery的命名空间,加上fn上的方法及属性,会对jquery实例每一个有效. 如扩展$.fn.abc() 那么你可以这样子:$("#div").abc(); 通常使 ...
- SQL Server 表和索引存储结构
在上一篇文章中,我们介绍了SQL Server数据文件的页面类型,系统通过96个字节的头部信息和系统表从逻辑层面上将表的存储结构管理起来,具体到表的存储结构上,SQL Server引入对象.分区.堆或 ...
- 结合源码看nginx-1.4.0之nginx全局变量ngx_cycle初始化详解
目录 0. 摘要 1. ngx_cycle_t结构设计 2. ngx_cycle_t数据结构 3. nginx全局变量ngx_cycle初始化 4. 小结 5. 参考资料 0. 摘要 Nginx核心的 ...
- cocos2d-x lua table数据存储
cocos2d-x lua table数据存储 version: cocos2d-x 3.6 1. 将table转为json http://blog.csdn.net/songcf_faith/art ...
- 数据结构【三】:简单优先队列PriorityQueue
在数据结构[二]:简单阻塞队列BlockingQueue的基础上添加权限属性:priority,并控制enqueue时根据priority排序插入. 1.定义priority取值范围0~9 2.deq ...