[Angular 2] Inject Service
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的更多相关文章
- [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 ...
- [Angular 2] Use Service use Typescript
When creating a service, need to inject the sercive into the bootstrap(): import {bootstrap, Compone ...
- Guice 学习(六)使用Provider注入服务( Provider Inject Service)
1.定义接口 package com.guice.providerInject; import com.google.inject.ProvidedBy; public interface Servi ...
- angular js自定义service的简单示例
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...
- Angular 学习笔记——service &constant
<!DOCTYPE HTML> <html ng-app="myApp"> <head> <meta http-equiv="C ...
- Angular:使用service进行http请求的简单封装
①使用ng g service services/storage创建一个服务组件 ②在app.module.ts 中引入HttpClientModule模块 ③在app.module.ts 中引入创建 ...
- [Angular] 'providedIn' for service
There is now a new, recommended, way to register a provider, directly inside the @Injectable() decor ...
- Angular:使用service进行数据的持久化设置
①使用ng g service services/storage创建一个服务组件 ②在app.module.ts 中引入创建的服务 ③利用本地存储实现数据持久化 ④在组件中使用
- angular之service、factory预provider区别
昨晚项目组做了angular分享,刚好有讨论到这个问题.虽然许久不做前端开发,但是兴趣所致.就查阅了下资料,以便后续需要使用 自己的理解:service是new出来的,factory是直接使用就能获得 ...
随机推荐
- spring配置中引入properties
<context:property-placeholder location="classpath*:db.properties" />
- redis 服务器端命令
redis 127.0.0.1:6380> time ,显示服务器时间, 时间戳(秒), 微秒数 1) "1375270361" 2) "504511" ...
- NLP相关资源
一 NLP相关资源站点 Rouchester大学NLP/CL会议列表 一个非常好的会议时间信息网站,将自然语言处理和计算语言学领域的会议,按照时间月份顺序列出. NLPerJP 一个日本友好人士维护的 ...
- 物联网操作系统 - Zephyr
What is Zephyr? Zephyr Project is a small, scalable real-time operating system for use on resource-c ...
- Perl常用特殊变量
perl 内置变量 $- 当前页可打印的行数,属于Perl格式系统的一部分 $! 根据上下文内容返回错误号或者错误串 $” 列表分隔符 $# 打印数字时默认的数字输出格式 $$ Perl解释器的进程I ...
- 转:jQuery常用插件
原文来自于:http://download.csdn.net/album/detail/369 jquery.cycle.all.js 上传者:itmyhome 上传时间:2014-06-1 ...
- SharePoint REST api
http://msdn.microsoft.com/en-us/magazine/dn198245.aspx Understanding and Using the SharePoint 2013 R ...
- AT24C512与AT24C512B的区别
前几日公司采购人员说现在AT24C512要停产了,替代型号为AT24C512B,因为公司产品中使用该器件较多,因此专门又研究了一下这两个芯片,发现还是有很多地方不同的. (1)AT24C512输入电压 ...
- Netty4.0学习笔记系列之三:构建简单的http服务(转)
http://blog.csdn.net/u013252773/article/details/21254257 本文主要介绍如何通过Netty构建一个简单的http服务. 想要实现的目的是: 1.C ...
- 揭开Linux操作系统的Swap交换区之谜
揭开Linux操作系统的Swap交换区之谜 Swap,即交换区,除了安装Linux的时候,有多少人关心过它呢?其实,Swap的调整对Linux服务器,特别是Web服务器的性能至关重要.通过调整Swap ...