在Angular 6中，当在生产模式下调用带有端口的API URL时，可能会遇到API端口在Angular生产模式中消失的问题。这是由于Angular生产构建默认会假设API请求将直接发送到与应用程序部署在同一端口的同一主机上。

为了解决这个问题，您可以使用environment.ts和environment.prod.ts文件来配置不同环境下的API URL。以下是一个代码示例：

首先，在src/environments/environment.ts文件中添加API URL：

export const environment = {
  production: false,
  apiUrl: 'http://localhost:3000/api'
};

然后，在src/environments/environment.prod.ts文件中添加生产环境下的API URL：

export const environment = {
  production: true,
  apiUrl: 'http://your-production-api-url.com'
};

接下来，在您的服务文件中，使用environment.apiUrl来获取API URL：

import { environment } from '../../environments/environment';

@Injectable()
export class ApiService {
  private apiUrl: string = environment.apiUrl;

  // 使用this.apiUrl进行API请求
}

最后，在您的组件文件中，通过DI（依赖注入）将ApiService注入，然后使用它来进行API请求：

import { Component, OnInit } from '@angular/core';
import { ApiService } from '../services/api.service';

@Component({
  selector: 'app-example',
  templateUrl: './example.component.html',
  styleUrls: ['./example.component.css']
})
export class ExampleComponent implements OnInit {
  constructor(private apiService: ApiService) {}

  ngOnInit() {
    this.apiService.get('/users').subscribe(response => {
      // 处理API响应
    });
  }
}

通过这种方式，您可以在不同环境下配置不同的API URL，并且在生产模式下不会丢失API端口信息。