Angular 2 Binding in Component

Question

Angular 2 Binding in Component

Navigation

#1 by (0 votes)
#2 by (0 votes)

2

I have the following scenario. I have a list in a webservice, but when I do a return to pass the value to my component it simply does not bind because it is time consuming, and even when it comes back I call the WS again it does not update the data. Here's how I'm trying to implement it. I've made this example over without putting the imports just to put here and expose the menu that I'm trying to implement.

@Component({
    template:'<div *ngFor="let dados of lista">{{dados.nome}}<br/></div>',
    selector: 'meu-component'
})
MeuComponent {
    private _vaiPraView: any;
    @Input() testes: any;

    ngOnInit() {
        this.trataDados();
    }

    trataDados () {
        this._vaiPraView = [];
        let idx = 0;
        for(let teste of this.testes) {
            teste.realvector = idx;
            idx++;
            this._vaiPraView.push(teste);
        }
    }
}

//html... com binding (não rola...)
@Component({
    template:'<meu-component [testes]="lista"></meu-component>',
    directives: [MeuComponent]
})
export class TestePage {
    private lista: any;

    constructor() {

    }

    ngOnInit () {
        //Um evento demorado.. formato de data exemplo: [{nome: 'oi'},{nome: 'tudobem'},{nome: 'contigo'}]
        AlgumaCoisa.then(data => {
            this.lista = data;
        });
    }
}

//html... sem binding rola porém quero que fique do jeito acima e detecte a alteração.
@Component({
    template:'<meu-component [testes]="[{nome: 'oi'},{nome: 'tudobem'},{nome: 'contigo'}]"></meu-component>',
    directives: [MeuComponent]
})
export class TestePage {
    private lista: any;

    constructor() {

    }

    ngOnInit () {
        //Um evento demorado.. formato de data exemplo: [{nome: 'oi'},{nome: 'tudobem'},{nome: 'contigo'}]
        AlgumaCoisa.then(data => {
            this.lista = data;
        });
    }
}

componentes angular binding

asked by anonymous 22.08.2016 / 15:30

2 answers

How to take the picture taken from the camera, not the camera preview The loaded screen is correct but the data is saved in another DB table [closed]

score 0 · Answer 1

0

You need to call the trataDados() function in ngOnChange to update the lista field of the MeuComponent component when the testes input is updated.

05.10.2016 / 13:36

score 0 · Answer 2

The right thing would be to use a variable of type Observable ... and use it in the subscribe method ... this ensures that it will be executed after the return ...

metodo.subscribe(result => {
   this.lista = result.json();
   console.log(result);
});