передать значение от родителя к ребенку

голоса
2

это мой layout.html

<form (ngSubmit)=onSubmit(searchval) [formGroup]=searchval>
                    <input type=text class=form-control required formControlName=Search placeholder={{ 'General.Search' | translate }}>
                    <button type=submit></button>
</form>

и в моем layout.component.ts у меня есть:

onSubmit({ value }: {
        value: Search
    }) {
        this.search.getSearchResult(value.Value);
    }

в этой службе я делаю HTTP GET:

getSearchResult(val: string) {
    this.httpCall.get('/pub/home/search?val=' + val)
        .subscribe(
        data => {
            console.log(data);
        });
}

Теперь я хочу передать эти данные в детской составляющей моего компонента макета . Как я могу это сделать?

Я хочу , чтобы перенаправить пользователя на другую страницу под названием , search.componentно я не хочу , чтобы мой строку поиска , чтобы быть в ссылке. так

mydomain.com/home
mydomain.com/search

и не

mydomain.com/search?val=something
Задан 27/12/2016 в 10:30
пользователем
На других языках...                            


2 ответов

голоса
1

Используйте событие эмиттер. Он будет вызывать метод компонента родительского и вы можете передать любой объект в этом вызове метода, как показано ниже:

Детский компонент:

import {ViewChild, Component, Output, EventEmitter}   from "@angular/core";

@Output() RefreshParentGridView = new EventEmitter();

public Close(): void {       
     let myObject:any; //Your object which pass in parent
     this.RefreshParentGridView.emit(myObject);               
}  

Родитель Компонент: выходной регистр событие , как показано ниже

HTML

<childTeg (RefreshParentGridView)= "RefreshGridView($event)"></childTeg>

Backend код

public RefreshGridView(model: any)
{
}
Ответил 27/12/2016 в 10:35
источник пользователем

голоса
3

Создание общего интерфейса и установить значение от ребенка и получить от родителей, как показано ниже:

Интерфейс:

import {Injectable} from "@angular/core";

export interface SharedModel {
    Name: string;
}

@Injectable()
export class Shared {

    SharedComponent: SharedModel = {
        Name: ''        
    };

    constructor() {       
    }
}

Родитель / Ребенок Компонент:

import {Shared, SharedModel}    from '../Shared';

public sharedData: SharedModel;
constructor(private sharedResource: Shared) {
    this.sharedData = sharedResource.SharedComponent;
}

Заданное значение:

this.sharedData.Name="Sandip Patel";

Получить значение:

console.log(this.sharedData.Name);
Ответил 27/12/2016 в 11:21
источник пользователем

Cookies help us deliver our services. By using our services, you agree to our use of cookies. Learn more