• 我是 typescript 和 angular js 的新手。
• 我试图在我的代码中包含另一个组件代码。
• 这是我代码中的 baby.js 代码
• 但我遇到了一个错误。类型错误:无法读取未定义的属性“tigerStart”
• 你们能告诉我如何解决吗？
• 在下面提供我的代码

TypeError: Cannot read property 'tigerStart' of undefined
    at init.open (pen-pencil.ts:1270)
    at init.trigger (kendo.all.min.js:25)
    at init.open (kendo.all.min.js:45)
    at Penguin.openPopup (pen-pencil.ts:1286)
    at penguin.pencilClicked (headset.ts:689)
    at _View_penguin4._handle_click_45_0 (penguin.ngfactory.js:4087)
    at eval (core.umd.js:9698)
    at eval (platform-browser.umd.js:1877)
    at eval (platform-browser.umd.js:1990)
    at ZoneDelegate.invoke (zone.js:203)

在整个js代码中包含tigerStart方法

@ViewChild(sports) 公共(public)天空:运动；

that.window = $("#PenguinPopup");
that.window.kendoWindow({
  width: "60%",
  title: false,
  visible: false,
  resizable: false,
  actions: [],
  draggable: false,
  modal: true,
  open: function() {
    $("html, body").css("overflow", "hidden");
    that.isVisible = true;
    $('.kPopUpTitle').html(values.title);
    this.sky.tigerStart();

在我的 html 中包含鱼组件

<div class="clearFloat"></div>
<ul class="kendu-custom-contextmenu" id="context-menuFinancialSearch">
  <li class="kPopUpBtnTriple">View Details</li>
  <li class="kPopUpBtnTriple">Manage Documents</li>
</ul>

<financeLeftSlider (savedSearchData)='getSaveEvent($event)'></financeLeftSlider>

<Fish></Fish>
<Penguin (documentCount)='getDocumentEvent($event)'></Penguin>
<sports></sports>

<div class="searchNameRequiredPopup">
  <div class="pipepobUpBox pipeWindow kPopupConfirmationBox">
    <div class="row pipePopUpGridCollection pipePopUpContent lineHeightInputs">
      <div class="pipeContent">Please enter the search name.</div>
    </div>
    <div class="clearFloat"></div>
    <div class="row pipePopUpFooter textAligncenterImp">
      <!-- <button class="commonBtn" type="button" id ="deleteDocumentYes">Yes</button> -->
      <button class="clearBtn" type="button" id="searchNameRequiredBtn">Ok</button>
    </div>
    <div class="clearFloat"></div>
  </div>
</div>

宝宝.html

<div id="baby"></div>
<div id="baby1"></div>

宝宝.js

@Component({
  moduleId: module.id,
  selector: 'sports',
  templateUrl: 'sports.html'
})

export class Star {

  tigerStart(): void {
    kendo.ui.sky($("#baby"), true);
  }
  tigerEnd(): void {
    kendo.ui.sky($("#baby"), false);

  }

  tigerStart1(): void {
    kendo.ui.sky($("#baby1"), true);
  }
  tigerEnd1(): void {
    kendo.ui.sky($("#baby1"), false);
  }

}

• 当我打印这篇文章时，我没有看到天空，所以我阅读了中等形式并尝试使用 fat arrow 和 bind，但我仍然无法实现它。
• 在 child 看来我正在使用运动
• 你能告诉我如何解决吗？
• 这样对以后会有帮助

https://medium.com/@thejasonfile/es5-functions-vs-es6-fat-arrow-functions-864033baa1a

@ViewChild(sports) public sky: sports;
**- tried with fat arrow**
open: () => {

**- tried with bind**
        this.sky.tigerStart().bind(this);

最佳答案

在这一行中:

this.sky.tigerStart();

您期望 this.sky 被设置为某个值，但事实并非如此。那是因为 this 不是你想的那样；您不在您认为自己所在的范围内。在此行之前添加一个console.dir(this)，刷新页面，如果您检查浏览器控制台想看看你的 this 是什么。然后找出一些其他方法来解决您真正需要的对象。

Mozilla Developer Network reference article for "this"

尝试以下操作:

// *** Assign this to a variable (self)
var self = this;

that.window = $("#PenguinPopup");
that.window.kendoWindow({
  width: "60%",
  title: false,
  visible: false,
  resizable: false,
  actions: [],
  draggable: false,
  modal: true,
  open: function() {
    $("html, body").css("overflow", "hidden");
    that.isVisible = true;
    $('.kPopUpTitle').html(values.title);

// *** use the self variable instead of this
    self.sky.tigerStart();

您在评论中提到的文章是正确的，但如果您不真正了解代码中发生的事情，那么如果您尝试按照它的建议去做，只会让您更加困惑。您可能想进一步了解变量作用域在 Javascript 中的工作原理。一开始有点困惑，但理解会帮助你更好地使用 Javascript。我自己仍然有问题，但我在这里展示的方式相当容易理解。请记住，当您声明一个变量并在同一级别(或在这些函数内部)声明函数时，您可以从这些函数内部访问该变量(除非您在这些函数内部创建具有相同名称的新变量)。

关于javascript - 类型错误 : Cannot read property 'tigerStart' of undefined，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/46257097/