要在Angular Universal中使从API加载的数据在页面源代码中显示，您可以使用Angular的HttpClient模块来加载数据，并使用Angular Universal的服务端渲染（Server-Side Rendering，SSR）功能。

首先，确保您已经在应用程序中正确安装和配置了Angular Universal。接下来，您需要进行以下步骤：

1. 创建一个服务来处理数据加载逻辑。在这个服务中，使用HttpClient模块来发送HTTP请求并获取数据。例如，您可以创建一个名为DataService的服务：

import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { Observable } from 'rxjs';

@Injectable()
export class DataService {
  constructor(private http: HttpClient) { }

  getData(): Observable {
    return this.http.get('your-api-url');
  }
}

2. 在组件中注入该服务，并在需要的时候调用getData方法来获取数据。例如，在您的组件中注入DataService服务，并在ngOnInit生命周期钩子中调用getData方法：

import { Component, OnInit } from '@angular/core';
import { DataService } from 'path-to-data-service';

@Component({
  selector: 'app-your-component',
  templateUrl: './your-component.component.html',
  styleUrls: ['./your-component.component.css']
})
export class YourComponent implements OnInit {
  data: any;

  constructor(private dataService: DataService) { }

  ngOnInit() {
    this.dataService.getData().subscribe(data => {
      this.data = data;
    });
  }
}

3. 在组件的HTML模板中使用data变量来显示数据。例如，您可以使用*ngFor指令来遍历数据数组：

  {{ item }}

4. 在应用程序的服务器端代码中，使用Angular Universal的renderModuleFactory函数来渲染带有数据的组件。例如，在Express服务器中，您可以创建一个路由处理程序来处理来自客户端的请求，并在路由处理程序中使用renderModuleFactory函数：

import { renderModuleFactory } from '@angular/platform-server';
import { AppServerModuleNgFactory } from './path-to-app-server-module-ngfactory';

app.get('*', (req, res) => {
  renderModuleFactory(AppServerModuleNgFactory, {
    document: indexHtml,
    url: req.url
  }).then(html => {
    res.send(html);
  });
});

通过上述步骤，您应该能够在使用Angular Universal的应用程序中将从API加载的数据显示在页面源代码中。请注意，由于服务器端渲染是在服务端执行的，因此在页面源代码中可以看到从API加载的数据。