Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- import {Component,OnInit} from '@angular/core';
- import {Car} from './car';
- import {CarService} from './car.service';
- @Component({
- selector: 'app-root',
- templateUrl: './app.component.html',
- styleUrls: ['./app.component.css']
- })
- export class AppComponent {
- title = 'app';
- }
- export class DataListDemo implements OnInit {
- cars: Car[];
- constructor(private carService: CarService) { }
- ngOnInit() {
- this.carService.getCarsLarge().then(cars => this.cars = cars);
- }
- }
- import {Injectable} from '@angular/core';
- import {Http, Response} from '@angular/http';
- import {Car} from './car';
- import 'rxjs/add/operator/toPromise';
- @Injectable()
- export class CarService {
- constructor(private http: Http) {}
- getCarsLarge() {
- return this.http.get('/assets/cars-large.json')
- .toPromise()
- .then(res => <Car[]> res.json().data)
- .then(data => { return data; });
- }
- }
- import { CarService } from './car.service';
- import { BrowserModule } from '@angular/platform-browser';
- import { NgModule } from '@angular/core';
- import { HttpModule } from '@angular/http';
- import {DataListModule} from 'primeng/primeng';
- import { AppComponent } from './app.component';
- @NgModule({
- declarations: [
- AppComponent
- ],
- imports: [
- BrowserModule, HttpModule, DataListModule
- ],
- providers: [CarService],
- bootstrap: [AppComponent]
- })
- export class AppModule { }
- <!--The content below is only a placeholder and can be replaced.-->
- <div style="text-align:center">
- <h1>
- Welcome to {{title}}!
- </h1>
- <img width="300" src="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNTAgMjUwIj4KICAgIDxwYXRoIGZpbGw9IiNERDAwMzEiIGQ9Ik0xMjUgMzBMMzEuOSA2My4ybDE0LjIgMTIzLjFMMTI1IDIzMGw3OC45LTQzLjcgMTQuMi0xMjMuMXoiIC8+CiAgICA8cGF0aCBmaWxsPSIjQzMwMDJGIiBkPSJNMTI1IDMwdjIyLjItLjFWMjMwbDc4LjktNDMuNyAxNC4yLTEyMy4xTDEyNSAzMHoiIC8+CiAgICA8cGF0aCAgZmlsbD0iI0ZGRkZGRiIgZD0iTTEyNSA1Mi4xTDY2LjggMTgyLjZoMjEuN2wxMS43LTI5LjJoNDkuNGwxMS43IDI5LjJIMTgzTDEyNSA1Mi4xem0xNyA4My4zaC0zNGwxNy00MC45IDE3IDQwLjl6IiAvPgogIDwvc3ZnPg==">
- </div>
- <h2>Here are some links to help you start: </h2>
- <ul>
- <li>
- <h2><a target="_blank" rel="noopener" href="https://angular.io/tutorial">Tour of Heroes</a></h2>
- </li>
- <li>
- <h2><a target="_blank" rel="noopener" href="https://github.com/angular/angular-cli/wiki">CLI Documentation</a></h2>
- </li>
- <li>
- <h2><a target="_blank" rel="noopener" href="https://blog.angular.io/">Angular blog</a></h2>
- </li>
- </ul>
- <p-dataList [value]="cars">
- <ng-template let-car pTemplate="item">
- Car content
- </ng-template>
- </p-dataList>
- export interface Car {
- vin;
- year;
- brand;
- color;
- }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement