如何在角度6中将项目添加到列表中?

时间:2019-03-11 13:47:22

标签: angular

我正尝试将代码添加到对象列表中,如代码所示。

这是关于仅添加项目,但我收到一个关于参数不能分配给类型参数的错误...

请查看我的代码以了解有关此问题的更多信息!

 // item to add :
 item: SideBarMenu[]=[];
 // list in which I want to add my item: 
 subMenuItems=[{
 code: '1',
 defaultLabel: 'Home ',
 icon: 'home',
 routerLink: ['/'],
 fragment: 'home-anchor'
},
{
code: '2',
defaultLabel: 'Table',
icon: 'table',
routerLink: ['table_demo'],
fragment: 'search-anchor'
  },
 {
  code: '3',
  defaultLabel: 'Interval',
 icon: 'calendar',
 routerLink: ['interval_demo'],
 fragment: 'search-anchor'
},
{
code: '4',
defaultLabel: 'Check-Box & Radio button',
icon: 'check_box',
routerLink: ['check_box_demo'],
fragment: 'search-anchor'
 }

]

     this is my class : 
     export class SideBarMenu {
       public code: string;
       public defaultLabel: string;
       public subMenus?: SideBarMenu[] = [];
       public routerLink?: string[] = [];
       public icon?: string;
       public fragment?: string;
       }

 // function : 
 addnew(){
 this.subMenuItems.push(this.item);
 this.showDialog=false;
 this.item=new SideBarMenu();
 }

   //   html part : 
        <form class="form-horizontal" #f="ngForm">
                <div class="form-group row">
                    <label class="col-md-3 col-lg-3 col-xl-2 control-label">Code <span style="color: red">*</span></label>
                    <div class="col-md-3 col-lg-3 col-xl-4">
                            <input type="number" name="code" min='1' placeholder="Entrer le code" [(ngModel)]="item.code" required> 
                    </div>

                    <label class="col-md-3 col-lg-3 col-xl-2 control-label">Icône </label>
                    <div class="col-md-3 col-lg-3 col-xl-4">
                            <input type="text" name="icone"  [(ngModel)]="item.icon" > 
                    </div>

                    <label class="col-md-3 col-lg-3 col-xl-2 control-label">Default Label <span style="color: red">*</span></label>
                    <div class="col-md-3 col-lg-3 col-xl-4">
                            <input type="text" name="defaultLabel" [(ngModel)]="item.defaultLabel" required> 
                    </div>
                    <label class="col-md-3 col-lg-3 col-xl-2 control-label">Fragment <span style="color: red">*</span></label>
                    <div class="col-md-3 col-lg-3 col-xl-4">
                            <input type="text" name="fragment" [(ngModel)]="item.fragment" required > 
                    </div>
                    <label class="col-md-3 col-lg-3 col-xl-2 control-label">RouterLink </label>
                    <div class="col-md-3 col-lg-3 col-xl-4">
                            <input type="text" name="routerLink" [(ngModel)]="item.routerLink" > 
                    </div>
                  </div>


        </form>

但是我遇到了这个错误:

    ERROR in src/app/sidebar-demo/sidebar-demo.component.ts(106,24): error 
    TS2345: Argument of type 'SideBarMenu[]' is not assignable to parameter 
   of type '{ code: string; defaultLabel: string; icon: string; routerLink: 
   string[]; fragment: string; }'.
   Property 'code' is missing in type 'SideBarMenu[]'.
   src/app/sidebar-demo/sidebar-demo.component.ts(108,1): error TS2322: Type 
   'SideBarMenu' is not assignable to type 'SideBarMenu[]'.
    Property 'includes' is missing in type 'SideBarMenu'.

请帮助我解决该问题?

1 个答案:

答案 0 :(得分:0)

应该是这样的

    let items:SideBarMenu[]=[];
 let   item1:SideBarMenuItem=new SideBarMenuItem()    {
     code: '1',
     defaultLabel: 'Home ',
     icon: 'home',
     routerLink: ['/'],
     fragment: 'home-anchor'
    }

    items.push(item1);