Angular 6 How to pass array in one component to other [closed]












-3















I want to get data from textboxes and show them in table. But the textboxes are in other component and table is in the other component means table is children, so how can we pass data from textboxes to table?






angular







share|improve this question















closed as off-topic by gustavohenke, David Walschots, Vega, Nkosi, Shree Jan 1 at 10:07


This question appears to be off-topic. The users who voted to close gave this specific reason:


  • "Questions seeking debugging help ("why isn't this code working?") must include the desired behavior, a specific problem or error and the shortest code necessary to reproduce it in the question itself. Questions without a clear problem statement are not useful to other readers. See: How to create a Minimal, Complete, and Verifiable example." – gustavohenke, David Walschots, Shree

If this question can be reworded to fit the rules in the help center, please edit the question.












  • 2





    Just read the documentation.

    – David Walschots
    Jan 1 at 9:52
















-3















I want to get data from textboxes and show them in table. But the textboxes are in other component and table is in the other component means table is children, so how can we pass data from textboxes to table?






angular







share|improve this question















closed as off-topic by gustavohenke, David Walschots, Vega, Nkosi, Shree Jan 1 at 10:07


This question appears to be off-topic. The users who voted to close gave this specific reason:


  • "Questions seeking debugging help ("why isn't this code working?") must include the desired behavior, a specific problem or error and the shortest code necessary to reproduce it in the question itself. Questions without a clear problem statement are not useful to other readers. See: How to create a Minimal, Complete, and Verifiable example." – gustavohenke, David Walschots, Shree

If this question can be reworded to fit the rules in the help center, please edit the question.












  • 2





    Just read the documentation.

    – David Walschots
    Jan 1 at 9:52














-3












-3








-3








I want to get data from textboxes and show them in table. But the textboxes are in other component and table is in the other component means table is children, so how can we pass data from textboxes to table?






angular







share|improve this question
















I want to get data from textboxes and show them in table. But the textboxes are in other component and table is in the other component means table is children, so how can we pass data from textboxes to table?






angular




angular






share|improve this question















share|improve this question













share|improve this question




share|improve this question








edited Jan 1 at 9:53









David Walschots

8,25452648




8,25452648










asked Jan 1 at 7:01









ZaIn KhAnZaIn KhAn

154




154




closed as off-topic by gustavohenke, David Walschots, Vega, Nkosi, Shree Jan 1 at 10:07


This question appears to be off-topic. The users who voted to close gave this specific reason:


  • "Questions seeking debugging help ("why isn't this code working?") must include the desired behavior, a specific problem or error and the shortest code necessary to reproduce it in the question itself. Questions without a clear problem statement are not useful to other readers. See: How to create a Minimal, Complete, and Verifiable example." – gustavohenke, David Walschots, Shree

If this question can be reworded to fit the rules in the help center, please edit the question.







closed as off-topic by gustavohenke, David Walschots, Vega, Nkosi, Shree Jan 1 at 10:07


This question appears to be off-topic. The users who voted to close gave this specific reason:


  • "Questions seeking debugging help ("why isn't this code working?") must include the desired behavior, a specific problem or error and the shortest code necessary to reproduce it in the question itself. Questions without a clear problem statement are not useful to other readers. See: How to create a Minimal, Complete, and Verifiable example." – gustavohenke, David Walschots, Shree

If this question can be reworded to fit the rules in the help center, please edit the question.








  • 2





    Just read the documentation.

    – David Walschots
    Jan 1 at 9:52














  • 2





    Just read the documentation.

    – David Walschots
    Jan 1 at 9:52








2




2





Just read the documentation.

– David Walschots
Jan 1 at 9:52





Just read the documentation.

– David Walschots
Jan 1 at 9:52












1 Answer
1






active

oldest

votes


















0














Since this a parent-child relationship between two components, you can create an @Input property in your Child Component and pass it from the Parent Component template:



Something like this:



Template of Parent Component:



<app-table

  *ngIf="data.length"

  [data]="data">

</app-table>


Child Component:



import { Component, Input } from '@angular/core';



@Component({...})

export class TableComponent {



  @Input() data: any;



}




Here's a Working Sample StackBlitz for your ref.







share|improve this answer






























    1 Answer
    1






    active

    oldest

    votes








    1 Answer
    1






    active

    oldest

    votes









    active

    oldest

    votes






    active

    oldest

    votes









    0














    Since this a parent-child relationship between two components, you can create an @Input property in your Child Component and pass it from the Parent Component template:



    Something like this:



    Template of Parent Component:



    <app-table
    
  *ngIf="data.length"
    
  [data]="data">
    
</app-table>


    Child Component:



    import { Component, Input } from '@angular/core';
    

    
@Component({...})
    
export class TableComponent {
    

    
  @Input() data: any;
    

    
}




    Here's a Working Sample StackBlitz for your ref.







    share|improve this answer




























      0














      Since this a parent-child relationship between two components, you can create an @Input property in your Child Component and pass it from the Parent Component template:



      Something like this:



      Template of Parent Component:



      <app-table
      
  *ngIf="data.length"
      
  [data]="data">
      
</app-table>


      Child Component:



      import { Component, Input } from '@angular/core';
      

      
@Component({...})
      
export class TableComponent {
      

      
  @Input() data: any;
      

      
}




      Here's a Working Sample StackBlitz for your ref.







      share|improve this answer


























        0












        0








        0







        Since this a parent-child relationship between two components, you can create an @Input property in your Child Component and pass it from the Parent Component template:



        Something like this:



        Template of Parent Component:



        <app-table
        
  *ngIf="data.length"
        
  [data]="data">
        
</app-table>


        Child Component:



        import { Component, Input } from '@angular/core';
        

        
@Component({...})
        
export class TableComponent {
        

        
  @Input() data: any;
        

        
}




        Here's a Working Sample StackBlitz for your ref.







        share|improve this answer













        Since this a parent-child relationship between two components, you can create an @Input property in your Child Component and pass it from the Parent Component template:



        Something like this:



        Template of Parent Component:



        <app-table
        
  *ngIf="data.length"
        
  [data]="data">
        
</app-table>


        Child Component:



        import { Component, Input } from '@angular/core';
        

        
@Component({...})
        
export class TableComponent {
        

        
  @Input() data: any;
        

        
}




        Here's a Working Sample StackBlitz for your ref.








        share|improve this answer












        share|improve this answer



        share|improve this answer










        answered Jan 1 at 7:51









        SiddAjmeraSiddAjmera

        15.6k31239




        15.6k31239

















            Popular posts from this blog

            MongoDB - Not Authorized To Execute Command

            Image
            .everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty,.everyoneloves__bot-mid-leaderboard:empty{ height:90px;width:728px;box-sizing:border-box; } 0 I have successfully enabled authorization on MongoDB and I have created an account on the admin database and then I created an account for my database called test. The following connection string to connect to my test database works successfully: mongo --host 192.168.17.52 --port 27017 -u user1 -p password --authenticationDatabase test Only problem I have now is, I cannot execute commands such as: show dbs. I get the following error when I try to do so: "errmsg" : "not authorized on admin to execute command { listDatabases: 1.0, lsid: { id: UUID("a1d5bc0d-bc58-485e-b232-270758a89455") }, $db: "admin...
            Read more

            How to fix TextFormField cause rebuild widget in Flutter

            Image
            .everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty,.everyoneloves__bot-mid-leaderboard:empty{ height:90px;width:728px;box-sizing:border-box; } 0 I've got the same issue at #9280. I tried all solutions from that topic with/without GlobalKey for Scaffold and Form but the problem wasn't fixed. I tried to build a authentication form with login and signup. But the keyboard doesn't show when I tap the TextFormField at the first time. Then I try to input some letter from physical keyboard, the widget is rebuilt. Like this: login screen Nothing to be log when I run flutter run --verbose, so I logged manually. Every tapping on field, the widget called dispose -> init -> build. [√] Flutter (Channel beta, v1.0.0, on Microsoft Windows [Version 10.0.17763.195], ...
            Read more

            in spring boot 2.1 many test slices are not allowed anymore due to multiple @BootstrapWith

            Image
            1 I tried to upgrade a yummy sandwich made of two test slices (@JsonTest and @JdbcTest in my case, crunchy test code in between) adding spring boot 2.1 flavour to it. But it seems it was not much of a success. I cannot annotate my tests with many @...Test since they are now each bringing their own XxxTestContextBootstrapper. It used to work when they all used same SpringBootTestContextBootstrapper. @RunWith(SpringRunner.class) @JdbcTest @JsonTest public class Test { @Test public void test() { System.out.printn("Hello, World !"); } } The error I get from BootstrapUtils is illegalStateException : Configuration error: found multiple declarations of @BootstrapWith for test class I understand I might be doing something wrong here but is there an easy way I could load both Json and Jdbc contex...
            Read more