angular 2 학습 노트 서비스 와 http

1921 단어 httptypescriptangular.js
현재 응용 개발 은 주로 spa 의 전후 분리 이 고 전후 단 통신 은 http 의 인 터 페 이 스 를 이용 하여 json 을 통 해 상호작용 을 한다.angular2-demo
효과 도
1.보 여 주 는 효과
2.mysql 데이터

코드 인 스 턴 스
1.서비스 서비스
import {Injectable} from '@angular/core';
import { Http }from '@angular/http';
import * as api from './../api/Api';
import {Observable} from 'rxjs/Rx';

@Injectable()
export class UserService {
    data:any;

    constructor(public http:Http) {
        this.http = http;
    }

    findAll():Observable {
        return this.http.get(api.findAll).map((res:any)=> {
            return res.json();
        });
    }
}

2.구성 요소 HttpService
import {Component,OnInit} from '@angular/core';
import { UserService } from './../../service/UserService';


@Component({
    selector: 'http-service',
    styles:[require('./HttpService.scss')],
    template: require('./HttpService.html'),
    providers: [UserService]
})

export class HttpServiceComponent implements OnInit {

    admins:Object;
    data:Object;

    constructor(public userService:UserService) {
        this.userService = userService;
    }


    ngOnInit():void{
        this.userService.findAll().subscribe((data:any) => {
            this.admins = data.adminUsers.content;
            console.log('in component : ',this.admins);
        });
        console.log(' HttpServiceComponent ngOnInit :', 'enter');
    }

}

3.템 플 릿 HttpService.html
    
    
  • {{i+1}}.{{item.userName}}
    •
Ubuntu 의 프로 그래 밍-C 언어 프로 그래 밍 환경
Unity 에서 Dll 사용 및 디 버 깅

좋은 웹페이지 즐겨찾기

개발자 우수 사이트 수집

개발자가 알아야 할 필수 사이트 100선 추천 우리는 당신을 위해 100개의 자주 사용하는 개발자 학습 사이트를 정리했습니다
best100-homepage