根据API响应动态加载页面和路由

时间:2018-12-19 16:13:58

标签: angular

我正在使用后端的Drupal作为API源来开发Angular 7应用程序。

数据将以这种格式来自Drupal

 {
  "nid": 123,
  "vid": 321,
  "title": "This is node title",
  "type": "page",
  "langcode": "en",
  "status": true,
  "uid": 2,
  "created": {
    "value": "2018-12-10T17:27:05+00:00",
    "format": "Y-m-d\\TH:i:sP"
  },
  "moderation_state": "published",
  "components": [
    {
      "type": "album",
      "data": {
        "variant": 2,
        "title": "Album title",
        "sub_title": "Album sub title",
        "images": [
          {
            "image": "/image1.jpg",
            "image_alt_text": "image alternate text string",
            "image_title": "image title text"
          },
          {
            "image": "/image1.jpg",
            "image_alt_text": "image alternate text string",
            "image_title": "image title text"
          }
        ]
      }
    }
  ]
}

因此,根据components数组的内容,我必须在html模板中动态添加组件,并将适当的数据传递给它们。

这里的另一个警告是,我只有一条通行路线

{
  path: '**',
  component: MasterComponent
}

这是因为会不时在Drupal上添加新页面,而不是每次添加新内容时都对angular应用进行更改。路线不会遵循某些常见的模式,因此无法实现动态路径。

现在我的问题是:

  1. 我大约有15-20个组件,这些组件必须根据API响应动态加载。这将使捆束尺寸巨大。有没有比将它们添加到entryComponents更好的方法了?
  2. 当路由未知时,是否有更好的方法来设置路由?

0 个答案:

没有答案