отображать список файлов с удаленного сервера в выпадающем меню с угловым 5

Question

Я пытаюсь отобразить список файлов в выпадающем меню Я использую пружинный MVC и угловой 5 мне удалось подключиться к серверу через sftpClient, и я перечислил файлы в моей консоли:

07-05 11:54:26.359 [http-nio-8080-exec-3] INFO  c.o.n.consumer.aspect.LogHandler -
            49fc7d93-d608-4221-9c8e-37b2861f2474;CRO;FCR;findCustomerServiceRepresentative;STOP;OK;
logs
apache246
tomcat

но в моем списке ngFor нет ничего, оно не определено:

connectToServer(logs : LogFiles[]) {
        const logsUrl = this._logUrl;
        return this.http.get(logsUrl);
    }
    
   
    ngOnInit() {
        this.logService.connectToServer(this.logs).subscribe(
            logs => {
               logs = logs;
            })
              console.log(this.logs);
    }
    
    
   export interface LogFiles {
    filename? : string;
    longname? : string;
    attrs? : SftpATTRS;
}

<div class="col-xs-4">
        <select class="form-control" [(ngModel)]="logs" name="files">
              <option *ngFor="let log of logs">{{ log.filename }}</option>
            </select>
</div>

что не так с моим кодом :)?

заранее спасибо

Answer 1

Для Angular вам нужно приложение и контроллер. Посмотрите пример ниже, вместо того, чтобы полагаться на ваш вызов данных, давайте предположим, что у нас есть заполненный объект, тогда этот объект может быть связан с раскрывающимся списком, как показано ниже:

angular.module('logApp', []).controller('logController', function($scope) {

  $scope.logs = [
    {fileName:'Blah'},
    {fileName:'Tada'},
    {fileName:'Wow'},
  ];
});

  <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.5.10/angular.min.js"></script>
  <script src="script.js"></script>

<div ng-app="logApp">
  <div ng-controller="logController">

    <p>I have {{logs.length}} logs!</p>

    <div class="col-xs-4">
            <select class="form-control" name="files">
                  <option ng-repeat="log in logs">
                      {{log.fileName}}
                  </option>
              </select>
    </div>
  </div>
</div>