Question

我无法理解范围在 Angular 中的工作方式。

我已经使用各种关键字进行了很多Google搜索，并创建了一些本地实验。

import { Injectable } from '@angular/core';

  @Injectable({
    providedIn: 'root'
  })
 export class PeopleService {

 givenProperty: string = "GivenString";

 givenFunction() {
  this.givenProperty = "NewGivenString";
  var one = 1;
  if (one == 1) {
    return this.givenProperty;
  }
 }
}

为什么givenProperty中的givenFunction不在范围内？如何在范围内创建它，以便可以对其进行更改并在功能之外再次使用它？

Answer 1

Angular 2.0使用新概念代替$ scope。 HTML元素在事件，属性和属性中已经具有易于绑定的接口。对于属性GivenProperty，您需要在HTML模板中使用它才能查看结果。

此外，Angular 2不像AngularJS那样在组件之间共享数据。它通过在模板内部使用数据并将事件传递给其他组件来绑定数据。

检查以下链接： https://angular.io/guide/component-interaction https://angular.io/guide/template-syntax

Answer 2

问题是Angular初学者的错误。上面问题中的函数从未调用过。要调用该函数，它必须在构造函数中。一旦将其添加到构造函数中，它便可以按预期工作。我会删除StackOverflow不会让我问的问题。

export class AppComponent {
  givenProperty: string = "GivenString";

  constructor() {
    this.givenProperty = this.givenFunction();
  }

  givenFunction() {
    this.givenProperty = "NewGivenString";
    var one = 1;
    if (one == 1) {
      return this.givenProperty;
    }
  }
}

了解Angular服务和组件的范围

2 个答案: