Question

在Angular 7应用程序中，我具有以下组件：

exports.quarter = functions.https.onRequest((req, res) => {
  // return a promise so that the function will wait for it to resolve before exiting

    userType1 = admin
      .database()
      .ref('users/Type1')
      .once('value');
    userType2 = admin
      .database()
      .ref('users/Type2')
      .once('value');
    userType3 = admin
      .database()
      .ref('users/Type3')
      .once('value');
    userType4 = admin
      .database()
      .ref('users/Type4')
      .once('value');
    app_con = admin
      .database()
      .ref('app_con')
      .once('value');

    Promise.all([userType1, userType2, userType3, userType4, app_con])
      .then(result => {
        const promises = [];
        console.log(0);
        result[0].forEach(action => {
          // add each async operation to a promise so that you can wait for them
          promises.push(
            action.ref.update({
              AverageRating:
                (action.val().Rating + action.val().AverageRating) / 2,
              Rating: 0
            })
          );
        });
        console.log(1);
        result[1].forEach(action => {
          promises.push(
            action.ref.update({
              AverageRating:
                (action.val().Rating + action.val().AverageRating) / 2,
              Rating: 0
            })
          );
        });
        console.log(2);
        result[2].forEach(action => {
          promises.push(
            action.ref.update({
              Rating: 0
            })
          );
        });
        console.log(3);
        result[3].forEach(action => {
          promises.push(
            action.ref.update({
              Rating: 0
            })
          );
        });
        let q = result[4].val().quarter;
        let y = result[4].val().year;
        if (q === 4) {
          q = 1;
          y = y + 1;
        } else {
          q = q + 1;
        }
        console.log(4);
        promises.push(
          result[4].ref.update({
            quarter: q,
            year: y
          })
        );

        return Promise.all(promises);
      })
      .then(result => {
        res.send('Done');
      })
      .catch(error => {
        res.status(500).send(error);
      });

});

在视图上，我有：

if (admin){
    Navigator.push(context, adminClassName);
} else {
    Navigator.push(context, normalClassName);
}

在ngOnInit内或变量声明中设置visible的初始值是否有任何区别，例如：

export class ListComponent implements OnInit {

  visible: boolean;

  ngOnInit() {
    this.visible = false;
  }

  toggle() {
    this.visible = !this.visible
  }

}

哪种方法更好？

Answer 1

当您已经知道要在变量中分配的数据时，最好在声明时对其进行初始化

@Component({...})
export class ChildComponent {

   visible: boolean = false;

}

但是但是，如果您的变量依赖于其他服务或功能，则you need to specify it inside the ngOnInit not on the constructor

”“大多数情况下，我们对所有的初始化/声明都使用ngOnInit，并避免在构造函数中使用某些东西。构造函数应仅用于初始化类成员，而不应执行实际的“工作”。

“ ngOnInit（）是“开始”的更好位置-解析组件绑定的位置/位置。”

- Pardeep Jain

@Component({...})
export class ChildComponent {

   visible: boolean;

   constructor(private sampleService: SampleService) {}

   ngOnInit() {
      this.visible = this.sampleService.isVisible;     // May it a plain boolean or an Observable that you need to subscribe
   }

}

Answer 2

因为构造函数是由JavaScript引擎而不是Angular调用的。 ngOnInit是Angular调用的生命周期的一部分，并在构造函数执行后调用。

在构造函数中，angular初始化并解析了该类的所有成员。

您可以在ngOnInit方法中执行任何初始操作。

在Angular组件中声明变量。在ngOnInit还是在变量声明中？

2 个答案: