Angular2:如果值没有改变,输入设置器不会拾取设置事件

时间:2016-12-16 19:50:34

标签: angular angular-components

在这里参考Angular2文档文件:[their documentation(父对子设置器),我有以下子组件代码:

import { Component } from '@angular/core';
@Component({
  selector: 'name-parent',
  template: `
  <h2>Parent </h2>
  <name-child [name]="name"></name-child>
  `
})
export class NameParentComponent {
   // somewhere on ngOnInit, set name without changing value
    ngOnInit() { 

        // get pending paged only and so on
        setTimeout(() => {
            this.name = "a";
            setTimeout(() => {
                this.name = "a";
                setTimeout(() => {
                    this.name = "a";
                },1000);

            },1000);

        },1000);
   }
}

父母很简单:

void func1(int* a)
{
  (*a)++;
}

const int g = 100;

void func2(void)
{
  func1(&g);
}

您希望控制台在3秒内注销“名称更改”三次。它没有,它记录一次,并忽略后续集(只有在值没有改变时才会发生这种情况)。无论值是否发生变化,如何使输入选择设置事件?

4 个答案:

答案 0 :(得分:5)

我看到两种解决方法:

1)使用不可变值

setTimeout(() => {
  this.name = new String("a");
    setTimeout(() => {
      this.name =  new String("a");
      setTimeout(() => {
       this.name =  new String("a");
    }, 1000);
  }, 1000);
}, 1000);

2)直接改变输入属性

@ViewChild(NameChildComponent) child: NameChildComponent;

setTimeout(() => {
  this.child.name = "a";
  setTimeout(() => {
    this.child.name = "a";
    setTimeout(() => {
      this.child.name = "a";
    }, 1000);
  }, 1000);
}, 1000);

答案 1 :(得分:1)

您明确提到的文章

  

使用setter拦截输入属性更改

当您尝试实现的目标不是跟踪更改时。这是关于从父母发送一个事件,这是RX Subject(其中4个中的任何一个)或Angular2 EventEmitter非常好的地方。

您可以在父级中创建其中一个并将其传递给子级。然后,在您订阅它之后,您可以跟踪所有事件,无论其值如何。

答案 2 :(得分:0)

如果使用输入设置器是严格的要求,但是你尝试过使用OnChanges,那么这不是肯定的吗?

import { Component, Input, OnChanges, SimpleChanges } from '@angular/core';
@Component({
  selector: 'name-child',
  template: '<h3>"{{name}}"</h3>'
})
export class NameChildComponent implements OnChanges {
  @Input() name;

  ngOnChanges(changes: SimpleChanges) {
    if (changes['name']) {
      console.log(`Is First Change: ${changes['name'].isFirstChange}`)
      console.log(`name change from ${changes['name'].previousValue} to ${changes['name'].currentValue}`);
    }
  }

}

答案 3 :(得分:0)

虽然yurzui的答案足以说明问题,但是如果它是对象,则可以使用

let newObj = JSON.parse(JSON.stringify(oldObj))

它将触发setter事件