Question

订阅中的变量是未定义的，但是当我在点击服务订阅之前放置断点时，我已经定义了变量。

在服务中：

getCashierRiskProfiles(): Observable<ICashierRiskProfile[]> {
    return this.http.get(this._baseUrl + "src/HTTPJson/cashierriskprofile.json")
        .map((res: Response) => res.json())
        .catch((error: any) => Observable.throw(error.json().error || 'Server error'));
}

在组件中：

import { Component, OnInit} from "@angular/core";
import { CashierRiskProfileService}   from "./cashierriskprofile.service";
import { ICashierRiskProfile} from "../shared/interfaces";
import { Observable } from 'rxjs/Observable';

  @Component({
            selector: "cashierriskprofile",
            templateUrl: "../src/app/cashierriskprofile/cashierriskprofile.component.html"
            })

    export class CashierRiskProfileComponent implements OnInit {
            filterText : string;
            cashierRiskProfiles: ICashierRiskProfile[];

         constructor(private sorter: Sorter,
                private service: CashierRiskProfileService) {

            }

         ngOnInit() {
                this.filterText = "Filter Exceptions:";
                //// Observable technique
                this.service.getCashierRiskProfiles()
                    .subscribe((riskProfiles) => {
                   this.cashierRiskProfiles = riskProfiles;
                   this.filterText = "Inside Subscribe:";

                    }, 
                    err => {
                        // Log errors if any
                        console.log(err);
                    });
            }

在ngonInit（）服务调用中的上面的组件代码中，subscribe中的this.cashierRiskProfiles是未定义的，但是在我在服务调用之前放置断点后，我将该变量可用并定义。我看到很多人在使用this.variablename gettting在subscribe中定义组件变量时遇到了这个问题。当你注意到this.filterText时，我可以在dataservice调用之外获取分配给它的值，但是当我在subscribe中放置断点时，this.filterText是未定义的，不知道我是如何丢失它的。任何人都可以提供正在发生的事情的解决方案吗？

Answer 1

我想这是因为在运行时这个内部订阅是SafeSubscribe，而不是你的组件。

使用closure来调用组件方法，如下所示：

<Table growing="true" growingScrollToLoad="true" >
<columns>
    <Column hAlign="Left" vAlign="Middle" visible="true" >
        <customData>
            <core:CustomData key="p13nData"
                value='\{"columnKey": "column1", "leadingProperty": "column1", "filterProperty": "column1", "columnIndex":"0"}' />
        </customData>
        <Text text="Column1" />
    </Column>
    <Column hAlign="Left" vAlign="Middle" visible="true" >
        <customData>
            <core:CustomData key="p13nData"
                value='\{"columnKey": "column2", "columnIndex":"1"}' />
        </customData>
        <Text text="Column2" />
    </Column>

</columns>
<items>
    <ColumnListItem>
        <cells>
               <HBox>
                    <core:Icon src="sap-icon://sys-help" />
                    <ToolbarSpacer width="5px"  />
                    <Text text="{column1}" tooltip="dasda" />
                </HBox>

        </cells>
         <cells>
              <Text text="{column2}" tooltip="dasda" />
        </cells>
    </ColumnListItem>
</items>

Answer 2

您的代码对我来说很好。我在我的项目中遵循相同的方法，并为我工作

无论如何，您可以尝试以下操作，让我知道它是否正常工作

ngOnInit() {
    this.filterText = "Filter Exceptions:";
    this.populateCashierRiskProfiles();
}

populateCashierRiskProfiles() {
    //// Observable technique
    this.service.getCashierRiskProfiles()
        .subscribe((riskProfiles) => {
            this.cashierRiskProfiles = riskProfiles
        });

}

Answer 3

尝试将本地变量传递给函数，如下所示：

ngOnInit() {
    this.populateCashierRiskProfiles(this.cashierRiskProfiles);
}

populateCashierRiskProfiles(crp: ICashierRiskProfile[]) {
    //// Observable technique
    this.service.getCashierRiskProfiles()
        .subscribe((riskProfiles) => {
            crp = riskProfiles
        });
}

您的CashierRiskProfiles现在应该填充有更新的RiskProfiles。

RxJS subscribe（）函数内的组件变量是未定义的

3 个答案: