Перемещать данные в компонент Router, [закрывший]

Я пробую реализовывать простое приложение, которое состоит из 3 компонентов: SearchComponent, ListComponent и DetailComponent, схема была бы такой, который я схватил:

introducir la descripción de la imagen aquí

Будучи видимый SearchComponent во всех совещаниях, и других 2 компонентах enrutados помещенные в router-outlet.

Моя проблема, - как я делаю для того, чтобы в первом случае (изображения), что то, что он ищет в SearchComponent, выдало список, который содержит ListComponent, и если я нахожусь в DetailComponent, который после того, как ищу что-то в SearchComponent, пересылал бы меня в первый случай выдавая уже список.

То, что у меня есть сейчас, состоит в том, чтобы давать в нему искать, убрало в маршрут: mipagina.com/s/palabra_que_he_puesto и этот path использовал ListComponent. Я оставляю вам часть приложения, как это у меня есть:

search.html

<header>
<div class="tab">
    <div class="tab_center">
        <div class="search_wrapper">
            <input #search (change)="handleChange(search.value)" placeholder="Buscar...">
        </div>
    </div>
</div>

search.component.ts

import {Component, Output} from '@angular/core';
import {Course} from './course';
import {Router} from '@angular/router';

@Component({
   selector: 'course-search',
   templateUrl: 'app/courses/course-search.html'
})

export class CourseSearchComponent { 

    constructor(private router: Router){}

    handleChange(search:string){
        this.router.navigate(['/s', search]);
    }
}

list.component.ts

import {Component, OnInit} from '@angular/core';
import {Course} from './course';
import {CourseService} from './course.service';
import {Router, ActivatedRoute} from '@angular/router';


@Component({
   templateUrl: 'app/courses/course-list.html',
   providers: [CourseService]
})

export class CourseListComponent implements OnInit{
   public courses:Course[];
   public ErrorMessage: string;
   private sub: Subscription;

   constructor(private courseData:CourseService, private router: Router,     private route: ActivatedRoute){
      this.sub = this.route.params.subscribe(params => {
        let search_key = params['search_key'];
        if(search_key){
            this.courses = this.courses.filter(element =>    element.name.indexOf(search_key)!==-1);
        }
        });
    }

    ngOnInit(){
        this.getCourses();
    }


    getCourses(){
        this.courseData.getCourses().subscribe(
        result => {
            if(!result){
                alert("Error en el servidor");
            }else{
                this.courses = result;
            }
        },
        error => {
            this.ErrorMessage = <any>error;
            if(this.ErrorMessage){
              alert("Error en la petición");
            }
        })
    }
    onSelect(course: Course) {
        this.router.navigate(['/course', course.id]);
    }
}

detail.component

import {Component, Output, OnInit} from '@angular/core';
import {Router, ActivatedRoute} from '@angular/router';
import {CourseService} from './course.service';

@Component({
    template: `Seleccionado el curso con id {{course}}`
})


export class CourseDetailComponent implements OnInit{ 

    private sub: Subscription;
    private course: number;

    constructor(
        private route: ActivatedRoute,
        private router: Router,
        private service: CourseService) {}

    ngOnInit(){
        this.sub = this.route.params.subscribe(params => {
            this.course = params['id'];
        });
    }
}

Я использую Угловой 2 RC5

РЕШЕННЫЙ: Он не импортировал хорошо маршруты в модуле :S

6
задан 12.04.2017, 10:23
0 ответов