问题[angularjs]

我有一个实体 Country (fields: id, name, valuta) 和一个实体 City (fields: id, name, country_id) 即 一个国家有很多城市（一对多的关系）。

当我向后端发出请求以获取所有城市时，会出现这样的数组：

[
    {
        "id": 1,
        "name": Moscow
    },
    ...
]

对所有国家的要求：

[
    {
        "id": 1,
        "name": Russia,
        "valuta": "RUB",
        "cities": [
            {
                "id": 1,
                "name": Moscow
            },
            ...
        ]
    },
    ...
]

也就是说，在城市数组中，我看不到该城市属于哪个国家。我想在城市表的页面上显示这些信息：

<div>
        <h3>Список городов</h3>
        <table class="table table-hover" cellpadding="0" cellspacing="0">
            <thead>
            <tr>
                <td>ID города</td>
                <td>Название</td>
                <td>Страна</td>
            </tr>
            </thead>
            <tbody>
            <tr ng-repeat="city in Cities">
                <td>{{city.id}}</td>
                <td>{{city.name}}</td>
                <td>?????????_КАК_????????????</td>
            </tr>
            </tbody>
        </table>
    </div>

现在js脚本是这样的：

angular.module('app', []).controller('indexController', function ($scope, $http) {

    const contextPath = 'http://localhost:8082';
    console.log(contextPath);
    
    $scope.getCountries = function () {
        const url = contextPath + '/country';
        $http.get(url)
                .then(function (resp) {
                    $scope.Countries = resp.data;
                });
    };

    $scope.getCities = function () {
        const url = contextPath + '/cities';
        $http.get(url)
                .then(function (resp) {
                    $scope.Cities = resp.data;
                });
    };

    $scope.fillPage = function () {
        $scope.getCountries();
        $scope.getCities();
    };

    $scope.fillPage();
    
});

告诉我怎样才能得到它？我试图以某种方式在 js 脚本中做到这一点。可能需要一些棘手的方法。

有一个Angular应用，在下载整个应用之前需要先请求获取用户数据，也就是需要等待服务器响应，将数据写入ngRx存储，然后才下载应用。

它的用途：应该限制管理页面并检查用户是否被授权，并且此信息应该来自服务器的响应。

还是有其他方法可以实现此功能？

有一个项目ionic，最常见的应用程序。而且我缺乏这个框架提供给我的功能，我可以创建一个常规.js文件，在那里编写代码并在项目中使用它，但是即使在我构建项目之后这个脚本也可以工作.apk？

我有一个组件：

import { Component, OnInit } from '@angular/core';
import { PostService } from '../shared/services/post.service';
import { CreatePost } from '../shared/model/post.model';
import { Router } from '@angular/router';

@Component({
selector: 'app-post',
templateUrl: './post.component.html',
styleUrls: ['./post.component.css']
})
export class PostComponent implements OnInit {

 confirmPost:CreatePost[] = [];
 unconfirmPost:CreatePost[] = [];
searchPost = '';

 constructor(
   private postService: PostService,
  private router: Router
  ) { }

  ngOnInit() {
  this.postService.getPosts()
  .subscribe((post: CreatePost[])=>{
    this.confirmPost = post.filter(p => p.confirm === true).reverse();
    this.unconfirmPost = post.filter(p => p.confirm === false);
  });
}

 watchPost(post:CreatePost){
   this.router.navigate(['/system/post', post.id],{queryParams: post});
 }

 confirmePost(post:CreatePost){
  post.confirm = true;
  this.postService.updatePost(post)
   .subscribe((poste:CreatePost[]) => {
   this.confirmPost = this.confirmPost.unshift(poste);
  });
  }
 }

CreatePost 模型：

export class CreatePost{
  constructor(
    public data: any,
    public category: string,
    public user: string,
    public title: string,
    public text: string,
    public like: number,
    public watch: number,
    public confirm: boolean,
    public id?: number
  ){}
}

当我尝试更新数组 this.confirmPost = this.confirmPost.unshift(poste); 我收到一个错误：

ERROR in src/app/system/post/post.component.ts(39,51): error TS2345: Argument of type 'CreatePost[]' is not assignable to parameter of type 'CreatePost'.
  Type 'CreatePost[]' is missing the following properties from type 'CreatePost': data, category, user, title, and 4 more.

有一个指令

app.directive('rootElement', function () {
    return {
        restrict: "E",
        controller:'rootElementController',
        templateUrl: undefined,
        link: function (scope, element, attr, ctrl) { 
            console.log(scope.testScope.pages[5]) 
            this.templateUrl = scope.testScope.pages[5];
        }
    }
});

它与某个控制器交互并从后者接收一条线（路径是这样的frontend/pages/page-main/index.html），我需要它才能得到它。这是templateUrl.

我可以link更改函数中的值templateUrl吗？

我按照示例中给出的方法进行了尝试，但是唉，啊（没有用）...

这可以以某种方式实现吗？

提示后，像这样实现

app.directive('rootElement', function () {
    return {
        restrict: "E",
        controller:'rootElementController',
        templateUrl: '<ng-include src="{{testScope.pages[5]}}"></ng-include>',
        link: function (scope, element, attr, ctrl) { 

        }
    }
});

但我收到一个错误