zoukankan      html  css  js  c++  java
  • [Angular 2] Use Service use Typescript

    When creating a service, need to inject the sercive into the bootstrap():

    import {bootstrap, Component, View} from "angular2/angular2";
    import {TodoInput} from "./todoInput";
    import {TodoService} from "./todoService";
    
    @Component({
        selector:'app'
    })
    @View({
        directives: [TodoInput],
        template: `
            <div><todo-input></todo-input></div>
        `
    })
    class App{
    
    }
    
    bootstrap(App, [TodoService]);

    todoService.js

    export class TodoService{
        todos: string[] = [];
    
        addTodo(value: any):void {
            this.todos.push(value);
        }
    }

    inputTodo.js:

    import {Component, View} 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{
        constructor(
            public todoService:TodoService  //pulbic make todoService global available for the class
        ){
            console.log(todoService);
        }
    
        onClick(event , value){
            this.todoService.addTodo(value);
            console.log(this.todoService.todos);
        }
    }
  • 相关阅读:
    spring与redis集成之aop整合方案
    Spring Boot 属性配置和使用
    nexus REST API /artifact/maven/[resolve|redirect] returns unexpected for v=LATEST
    Nginx CORS实现JS跨域
    Spring Boot简介
    关于EOF:
    C语言的那些事
    基础常识
    数组
    基本语句结构
  • 原文地址:https://www.cnblogs.com/Answer1215/p/4904669.html
Copyright © 2011-2022 走看看