Javascript 如果Angular2中的布尔值为真，如何调用函数？

在这里，我编写了一个弹出函数，其中一个布尔标志是它们在我的组件类中的位置。我的标志将根据我的条件返回true或false。在模板类中，当标志变为真时，需要启动弹出功能，然后立即出现我的弹出对话框。但我不知道如何称呼正确的方法，如果有人知道，请帮助我正确的方法

包含条件错误
&时代；
{{alertMessage}}

好啊

一般来说，在角度表达式中调用具有副作用的函数是个坏主意。Angular可以自由调用这些函数，但它通常喜欢确保结果仍然相同。您应该在这些表达式中使用函数来返回结果，而不是导致操作

我建议改为从您的控制器调用popupAlert，例如

$scope.$watch('commaSeparation', function(commaSeparation) {
        // The value of commaSeparation has just changed. Alert if it changed to true!
        if (commaSeparation) {
            popupAlert();
        }
    });

---

您可以通过实现接口OnChanges来实现这一点，该接口是Angular的生命周期挂钩

import { Component, OnChanges, SimpleChanges } from '@angular/core';


@Component({
  selector: 'my-app',
  templateUrl: './app.component.html',
  styleUrls: [ './app.component.css' ]
})
export class AppComponent implements OnChanges  {

  // the flag property
  commaSeparation: boolean;

  ngOnChanges(changes: SimpleChanges){
    if (changes['commaSeparation'] && changes['commaSeparation'].currentValue){
        this.showPopup();
    }
  }

  public showPopup(){
        alert('Replace this alert by the code that shows your popup');
  }
}

---

参考：

如果

commaSeparated

是一个输入属性，您可以使用

ngochanges

生命周期钩子添加属性更改watcher，然后调用

popupAlert

如果

commaSeparation

已更改（）

---

如果

commaSeparated

仅在组件内部更改，则可以将其设置为私有，并使用getter/setter对触发弹出窗口：

@Component({
...
})
export class MyComponent implements OnChanges {

  // ...

  private _commaSeparation = false;

  // ...

  get commaSeparation() {
    return this._commaSeparation;
  }

  set commaSeparation(value) {
    this._commaSeparation = value;

    if (value) {
       this.popupAlert();
    }
  }
}

---

OP不使用angularjs（v1.x）使用Angular2+OP希望在

commaSeparation

变为true时显示弹出窗口。您的解决方案将始终在视图初始化后显示。@Rodrigo非常感谢您的回复，但我已经尝试过了，我的弹出窗口不会出现。基本上，我的'commaSeparation'在'ngAfterViewInit（）'中得到了更改。@Rodrigo但我在'ngAfterViewInit（）'中调用了它自己，就像（this.commaSeparation==true）{this.displayModel（）；}，这工作正常，但chrome控制台得到了一个error@Royal,表达式ChangedTerithasBeenCheckedError错误可能发生在Angular app的开发模式中，而不是生产模式中。详细的错误消息应该说明这一点。如果您对此不满意，您可以尝试中介绍的一些Workaround解决方案。非常感谢您的回复，但我已经尝试过了，我的弹出窗口不会出现。基本上，我的'commaSeparation'在'ngAfterViewInit（）'中发生了变化，您现在应该发布代码了。我们需要知道如何更改

commaSeparation

。初始commaSeparation将为false，this.commaSeparation=this.genericvalidater.validateMultiComma（this.orderUnitForm）；此函数返回true或false。如果是真的，那么我需要调用我的popup（）警报方法。你能发布你的组件（模板、控制器）的代码吗？您没有看到弹出窗口有几个潜在的原因。更新后，请立即查看。查看有关ExpressionChangedTerithasBeenCheckedError的信息。并请张贴您的模板以及。您可能可以依靠反应性来显示弹出窗口，例如，只要

commaSeparation

为真，模板中的

..

之类的内容就会呈现

弹出窗口

。@FK82否，我已更改了它。现在我没有在模板中使用*ngIf，您也可以查看它。现在警报正常，但出现错误，我正在阅读您提供的文章。您是否在模板中使用在

subscribe

处理程序中设置的任何类属性（即

displayMessage

，

valid

，

commaSeparation

）？

@Component({
...
})
export class MyComponent implements OnChanges {

  // ...

  private _commaSeparation = false;

  // ...

  get commaSeparation() {
    return this._commaSeparation;
  }

  set commaSeparation(value) {
    this._commaSeparation = value;

    if (value) {
       this.popupAlert();
    }
  }
}