在角度6中传入组件时,值未定义

时间:2018-12-20 02:18:32

标签: node.js angular api angular6

我有一个服务,该服务调用API(Http获取请求),然后在组件中调用该服务以获取数据,然后将其分配给一个值。之后,我将html中的值传递给另一个组件,但显示为未定义

Dim Rs As Object

Sub LoopThroughFiles()
    Dim StrFile As String
    Dim aBook As Workbook, DestSheet As Worksheet
    Dim dest As Range
    Dim CurDir As String
    Dim diaFolder As FileDialog
    Dim Fn As String
    Dim Target As Range
    Dim strSQL As String

    Set DestSheet = ThisWorkbook.Sheets("data modified")


    ' Chose directory
    MsgBox "Select Folder"
    ' Open the file dialog
    Set diaFolder = Application.FileDialog(msoFileDialogFolderPicker)
    'FIX: how to make the current directory the default for diaFolder?
    diaFolder.AllowMultiSelect = False
    diaFolder.Show

    'This captures the Folder pathname
    CurDir = diaFolder.SelectedItems(1)

    ChDir CurDir
    'cleanup
    Set diaFolder = Nothing

    StrFile = Dir(CurDir & "\*.xls")
    Dim aCell As Range

    strSQL = "Select * from [Report$F1:F65536] "

    Do While Len(StrFile) > 0
        Fn = CurDir & "\" & StrFile
        ' First cell of destination range
        Set Target = DestSheet.Range("T4").End(xlToRight).Offset(-3, 1)
        getRs Fn, strSQL
        Target.CopyFromRecordset Rs
        Rs.Close
        Set Rs = Nothing

        StrFile = Dir
    Loop


    MsgBox "Done"
End Sub

Sub getRs(Fn As String, strQuery As String)
    Dim strConn As String

    strConn = "Provider=Microsoft.ACE.OLEDB.12.0;" & _
            "Data Source=" & Fn & _
             ";Extended Properties=""Excel 12.0 Xml;HDR=NO;IMEX=1"";"

    Set Rs = CreateObject("ADODB.Recordset")
    Rs.Open strQuery, strConn

End Sub

下面是我将值传递给新组件的地方,但显示未定义

import { Component } from '@angular/core';
import { AuthService } from '../../src/app/services/auth.service';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  title = 'app';
  passData: any
  constructor(private authService: AuthService) {
  }
  ngOnInit() {
    this.authService.test().subscribe(data => {
      for (var i = 0; i < data.length; i++) {
            data[i].date = new Date(
            data[i].date.substring(0, 4)+'-'+
            data[i].date.substring(4, 6)+'-'+
            data[i].date.substring(6, 10)+ ' '+data[i].minute)
          }
          this.passData = data;
    });
  }

}

passData的值在传递时是不确定的,但是如果我将其记录下来,它将在控制台中显示该值

3 个答案:

答案 0 :(得分:0)

经过一些研究,答案非常简单,我发现您可以简单地使用* ngIF来检查值,然后再加载

    <app-stock-bar  *ngIf="passData"  [customTitle]="passData"></app-stock-bar>

答案 1 :(得分:0)

将值从父级传递到子级组件时。您可以在onChanges LifeCycle挂钩中访问它。

组件

@Component({})
export class AppStockBar implements OnChanges{

  @Input() customTitle;
  ngOnChanges(){
    console.log(this.customTitle);
  }
}

答案 2 :(得分:-1)

我认为属性绑定缺少双引号

 <app-stock-bar  [customTitle]="passData"></app-stock-bar>