无法读取null的属性（读取＆＃x27;控件＆＃x27;）嵌套形式的形式

发布于 2025-01-26 09:05:43 字数 1133 浏览 3 评论 0原文

我是新来的角。努力根据Angular创建嵌套形式，我面临着基于下面显示的JSON结构来控制某些字段的困难，我面临的困难在获得Control Assetslist -＆gt;描述部分

data = {
    headline: [
      {
        language: 'en',
        headlineText: 'example headline',
      },
    ],
    bodyText: [
      {
        language: 'en',
        bodyText: 'example bodytext',
      },
    ],
    location: {
      name: 'mkontheway',
      openingHours: [
        {
          day: 'Mon-frd',
          timing: '10.00PM-9AM',
        },
      ],
      address: {
        postCode: 'test',
        country: 'test',
      },
    },
    assetsList: [
      {
        description: [
          {
            language: 'En',
            text: 'Sports News Updated',
          },
        ],
        assetType: 'Description',
        assetLink: 'NewsLink',
        filePath: 'Not yet fill',
      },
    ],
  };

创建了一个相同的stackblitz

我 create-news/create-news.component.ts“ rel =“ nofollow noreferrer”> stackblitz链接

原文

I'm new to angular. Working on creating nested form in angular where I'm facing difficulties for getting controls of some fields based on the JSON structure shown below where I'm facing difficulties in getting control assetsList -> description section

data = {
    headline: [
      {
        language: 'en',
        headlineText: 'example headline',
      },
    ],
    bodyText: [
      {
        language: 'en',
        bodyText: 'example bodytext',
      },
    ],
    location: {
      name: 'mkontheway',
      openingHours: [
        {
          day: 'Mon-frd',
          timing: '10.00PM-9AM',
        },
      ],
      address: {
        postCode: 'test',
        country: 'test',
      },
    },
    assetsList: [
      {
        description: [
          {
            language: 'En',
            text: 'Sports News Updated',
          },
        ],
        assetType: 'Description',
        assetLink: 'NewsLink',
        filePath: 'Not yet fill',
      },
    ],
  };

I created a Stackblitz for the same please help me for solving this error

StackBlitz link

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

负佳期 2025-02-02 09:05:43

索引的功能

getAssetsListDescriptionFormData(index:number) {
    return <FormArray>this.assetsListFormData.at(index).get('description');
}

AssetSlistDescriptionFormData可以不是成为一个getter，因为您需要表示AssetSlist的“索引” - 您在另一个formarray内部有一个formarray-否则您通过索引并使用

<div formArrayName="description" style="position: relative;">
   <div *ngFor="let description of 
              getAssetsListDescriptionFormData(assetsListGroup).controls; 
              let assetsListDescriptionGroup=index">
        
      <div class="form-fields-wrapper" [formGroupName]="assetsListDescriptionGroup">
              ...
      </div>
   </div>
</div>

assetsListDescriptionFormData can not be a getter because you need indicate the "index" of the assetsList -you has a FormArray inside another FormArray- else a function that you pass an index

getAssetsListDescriptionFormData(index:number) {
    return <FormArray>this.assetsListFormData.at(index).get('description');
}

And use

<div formArrayName="description" style="position: relative;">
   <div *ngFor="let description of 
              getAssetsListDescriptionFormData(assetsListGroup).controls; 
              let assetsListDescriptionGroup=index">
        
      <div class="form-fields-wrapper" [formGroupName]="assetsListDescriptionGroup">
              ...
      </div>
   </div>
</div>

回复收藏 0 原文

~没有更多了~