@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(元数据)的更多相关文章

  1. MetaData元数据

    一.基础 定义:数据库.表.列相关信息的描述.    何时使用:想取得对数据库的信息时使用.    一]数据库元数据——通过DataBaseMetaData            DataBaseMe ...

  2. Impala 中invalidate metadata和refresh

    首先了解一下:Impala如何融入Hadoop生态系统 Impala使用了Hadoop生态系统中许多熟悉的组件.Impala可以作为消费者和生产者与其他Hadoop组件交换数据,因此它可以以灵活的方式 ...

  3. Spring 中的 MetaData 接口

    什么是元数据(MetaData) 先直接贴一个英文解释: Metadata is simply data about data. It means it is a description and co ...

  4. Angular杂谈系列1-如何在Angular2中使用jQuery及其插件

    jQuery,让我们对dom的操作更加便捷.由于其易用性和可扩展性,jQuer也迅速风靡全球,各种插件也是目不暇接. 我相信很多人并不能直接远离jQuery去做前端,因为它太好用了,我们以前做的东西大 ...

  5. android开发中获取<meta-data>数据

    在 AndroidManifest.xml 中,<meta-data>元素是一个键值对,往往被包含在<application> .<activity>.<se ...

  6. 如何在Angular2中使用Forms

    在Angular2中形成两个基本对象是Control和ControlGroup. 控制用户输入 Control 一个控制表示一个输入字段(ngFormControl) 一个控制可以绑定到一个input ...

  7. Android中&lt;meta-data&gt;的使用

    在AndroidManifest.xml中.<meta-data>元素能够作为子元素,被包括在<activity>.<application> .<servi ...

  8. Angular2中Input和Output

    @Input @Input是用来定义模块的输入的,用来让父模块往子模块传递内容: @Output 子模块自定义一些event传递给父模块用@Output. 对于angular2中的Input和Outp ...

  9. SpreadJS 在 Angular2 中支持哪些事件?

    SpreadJS 纯前端表格控件是基于 HTML5 的 JavaScript 电子表格和网格功能控件,提供了完备的公式引擎.排序.过滤.输入控件.数据可视化.Excel 导入/导出等功能,适用于 .N ...

随机推荐

  1. [Express] Level 4: Body-parser -- Delete

    Response Body What would the response body be set to on a DELETE request to /cities/DoesNotExist ? H ...

  2. swift:自定义UICollectionViewFlowLayout

    写作目的 UICollectionView是ios中一个十分强大的控件,利用它能够十分简单的实现一些很好看的效果.UICollectionView的效果又依赖于UICollectionViewLayo ...

  3. Xcode常见的编译、运行等错误的解决

    Xcode常见的编译.运行等错误的解决 项目没找到Info.plist的错误 The solution for this particular instance of the error was “I ...

  4. direction:rtl demo

    <style> body {font:14px/18px Consolas;} div { width:100px;padding:10px; margin:10px 0px 30px 0 ...

  5. cocos2d-x学习之自动内存管理

    一.自动内存管理 1)概述 C++语言默认是没有提供自动内存管理的.使用者需要自己分配,自己释放.在cocos2d-x里提供了一个自动内存管理的方案.主要是通过CCObject来提供的,用户只要继承了 ...

  6. 使用docker-hub

    使用docker hub 需要其账号 基本操作 查找镜像 sudo docker search centos 每个用户有自己的命名空间,如:centos是存仓库中的镜像文件,admln/centos则 ...

  7. SQL性能优化十条经验

    1.查询的模糊匹配 尽量避免在一个复杂查询里面使用 LIKE '%parm1%'—— 红色标识位置的百分号会导致相关列的索引无法使用,最好不要用. 解决办法: 其实只需要对该脚本略做改进,查询速度便会 ...

  8. C#基础--struct(结构体)

    结构体和类有点类似    我们定义一个类的时候    是class   类名   定义结构体的时候是 struct   结构体名 结构体的写法 struct Point { // public int ...

  9. J2SE J2EE J2ME的区别

    J2SE J2EE J2ME的区别 J2SE J2EE J2ME的区别多数编程语言都有预选编译好的类库以支持各种特定的功能,在Java中,类库以包(package)的形式提供,不同版本的Java提供不 ...

  10. 自定义PopupWindow弹出框(带有动画)

    使用PopupWindow来实现弹出框,并且带有动画效果 首先自定义PopupWindow public class LostPopupWindow extends PopupWindow { pub ...