【Angular2】开发中的小问题

前言

在Angular2开发的过程中遇到一些问题，现记录一下，避免重复同样的错误

---

 

ngOnChanges截听输入属性值的变化问题

在组件交互中，使用了ngOnchanges来监听传输到组件数据的微小变化
官网中使用的是两个变量，他们的变化可以很好监听出来，而我传输的是一个实体，每次改变的是实体里面的属性值
但是第一次能监听到，后来就不行，换一个可以监听，在换回之前又可以监听了，在点击就又不可以了
后来分析了一下，不会监听对象的属性，而是在监听对象，只要对象不改变，就不会触发事件

所以解决方案就是在方法体内声明对象，这样每次生成的都是新的对象

 //用户的答案(在方法内声明，每次提交为新答案实体，simplechange才会识别) let answer: Answer = new Answer;

 

---

 

CheckBox获取用户选项问题

需要获取用户的多项选择，并及时更新，在这里，对于多项选择的遍历获取答案需要记录一下

private options: Array<string> = [];//用户的答案选项（在方法外声明，否则本题刚选择答案会消失）

  updateAnswer(el: Element, checked: boolean, value: string) {    //获得用户的答案    var index: number = this.options.indexOf(value);    if (checked) {      if (index < 0) {        this.options.push(value);      }    } else {      if (index > -1) {        this.options = this.options.filter((ele, index) => {          return ele != value;        })      }    }}

 

---

 

获得id后，无法根据此id获取相应的元素

从另一个组件传回一个id，需要根据这个id修改本组件内一个元素样式，达到联动效果。通过console控制台看到id确实返回且正确，但根据id就是找不到元素，例如：“121”
问题就是因为，返回实体后通过json转化，字符串前后加了引号，不是“121”，而是121

解决很简单，就是去掉引号
（这个错误有点类似有个程序员把名字叫做“null”这个字符串，联调的程序员就崩溃了，明明感觉没问题，怎么一直返回是null呢；刚开始一直以为引号是控制台加的用来方便看的）

let changedId = str.substring(1, str.length - 1);//去除首尾引号

 

---

 

小结

点滴积累，遇到问题，仔细分析