TypeScript is used heavily as we build up our application, but TypeScript isn’t required. If you want to Inject a Service without using TypeScript, you’ll need to understand the @Inject decorator.

import {Component, View, Inject} from "angular2/angular2";
import {TodoService} from "./todoService"; @Component({
selector: 'todo-input'
}) // Define a ref by using xxx-YYY
// Reference a ref by using xxxYyy
@View({
template: `
<input type="text" #log-me />
<button (click)="onClick($event, logMe.value)">Log Input</button>
`
})
export class TodoInput{
todoService;
constructor(
// public todoService:TodoService //pulbic make todoService global available for the class
@Inject(TodoService) todoService;
){
console.log(todoService);
} onClick(event , value){
this.todoService.addTodo(value);
console.log(this.todoService.todos);
}
}

[Angular 2] Inject Service的更多相关文章

  1. [Angular 2] Inject Service with "Providers"

    In this lesson, we’re going to take a look at how add a class to the providers property of a compone ...

  2. [Angular 2] Use Service use Typescript

    When creating a service, need to inject the sercive into the bootstrap(): import {bootstrap, Compone ...

  3. Guice 学习(六)使用Provider注入服务( Provider Inject Service)

    1.定义接口 package com.guice.providerInject; import com.google.inject.ProvidedBy; public interface Servi ...

  4. angular js自定义service的简单示例

    <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...

  5. Angular 学习笔记——service &constant

    <!DOCTYPE HTML> <html ng-app="myApp"> <head> <meta http-equiv="C ...

  6. Angular:使用service进行http请求的简单封装

    ①使用ng g service services/storage创建一个服务组件 ②在app.module.ts 中引入HttpClientModule模块 ③在app.module.ts 中引入创建 ...

  7. [Angular] 'providedIn' for service

    There is now a new, recommended, way to register a provider, directly inside the @Injectable() decor ...

  8. Angular:使用service进行数据的持久化设置

    ①使用ng g service services/storage创建一个服务组件 ②在app.module.ts 中引入创建的服务 ③利用本地存储实现数据持久化 ④在组件中使用

  9. angular之service、factory预provider区别

    昨晚项目组做了angular分享,刚好有讨论到这个问题.虽然许久不做前端开发,但是兴趣所致.就查阅了下资料,以便后续需要使用 自己的理解:service是new出来的,factory是直接使用就能获得 ...

随机推荐

  1. ubuntu 14.04.02 LTS 启动项误写入 /dev/sda1 (win 7 loader) 修复

    问题描述: 在win7下安装Ubuntu14.04,由于启动项 /boot loader 安装位置错误(/dev/sda1 (win 7 loader) )导致无法进入Windows(在GRUB界面能 ...

  2. 人人网FED CSS编码前端开发规范

    文件相关规范 1.文件名必须由小写字母.数字.中划线-组成 2.文件必须用utf-8编码 3.文件引入可通过外联或内联方式引入: 3.1 外联方式:<link rel=”stylesheet” ...

  3. Skinned Mesh原理解析和一个最简单的实现示例

    Skinned Mesh 原理解析和一个最简单的实现示例   作者:n5 Email: happyfirecn##yahoo.com.cn Blog: http://blog.csdn.net/n5 ...

  4. odoo view field option, action flage 参数

    options JSON object specifying configuration option for the field's widget (including default widget ...

  5. 为什么Android AsyncTask的使用要遵循五大原则

    引言 AsyncTask是一个围绕Handler和Thread而设计的助手类,封装了在工作线程中与UI交互的细节,只需要对应重写几个回调方法即可,并使得代码更加简洁,优雅.但要注意的是AsyncTas ...

  6. Binding在WPF中的使用

    闲来无事,不想打DOTA,在这里小小研究下wpf中关于Binding的东西. 咯咯 在我们印象中,Binding的意思是“绑定”,这个“绑”大概取自于Bind这个单词吧,这么理解的话就是以音译英了,没 ...

  7. hadoop如何计算map数和reduce数(未读)

    http://blog.csdn.net/lpxuan151009/article/details/7937821

  8. Prime Path

    poj3126:http://poj.org/problem?id=3126 题意:给你两个数n,k,两个数都是四位数的素数.现在让你改变n的一位数,让n变成另外一个素数.然后把这个素数在改变其中的以 ...

  9. SOC

    http://marsvaadin.iteye.com/blog/1311438 http://blog.csdn.net/cxxsoft/article/details/12610641

  10. hdu 5150 Sit sit sit

    http://acm.hdu.edu.cn/showproblem.php?pid=5151 直接判断是不是素数,然后再注意1就行. #include <cstdio> #include ...