angular5 子組件監(jiān)聽(tīng)父組件傳入值的變化方法
更新時(shí)間：2018年09月30日 09:44:30 作者：strong90
今天小編就為大家分享一篇angular5 子組件監(jiān)聽(tīng)父組件傳入值的變化方法，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧
項(xiàng)目中遇到一個(gè)問(wèn)題，就是在ngInit()中調(diào)用方法，只調(diào)用一次的問(wèn)題，當(dāng)父組件傳值變化時(shí)，并不會(huì)再次執(zhí)行。
import {
Component,
Input,
OnChanges,
SimpleChanges
} from '@angular/core';
import {
NavController
} from 'ionic-angular';
@Component({
selector: 'cs-img-lazy',
templateUrl: 'cs-img-lazy.html'
})
export class CsImgLazyComponent implements OnChanges {
@Input() default: string;
@Input() src: string
constructor(public navCtrl: NavController) {
}
ngOnInit() {
}
ngOnChanges(changes: SimpleChanges) {
console.log('ngOnChanges', this.src);
this.loadImage(this.src, () => {
this.default = this.src;
});
}
loadImage(url, callback) {
var img = new Image();
img.onload = () => {
if (img.complete) {
img.onload = null
callback(img);
return;
}
}
img.src = url;
}
}
以上這篇angular5 子組件監(jiān)聽(tīng)父組件傳入值的變化方法就是小編分享給大家的全部?jī)?nèi)容了，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。
相關(guān)文章
利用AngularJs實(shí)現(xiàn)京東首頁(yè)輪播圖效果
這篇文章給大家介紹了如何利用AngularJs實(shí)現(xiàn)京東首頁(yè)輪播圖的效果，本文通過(guò)示例代碼詳細(xì)介紹了實(shí)現(xiàn)過(guò)程，對(duì)大家學(xué)習(xí)AngularJS具有一定參考借鑒價(jià)值，有需要的朋友們可以參考借鑒。2016-09-09
AngularJS使用Filter自定義過(guò)濾器控制ng-repeat去除重復(fù)功能示例
這篇文章主要介紹了AngularJS使用Filter自定義過(guò)濾器控制ng-repeat去除重復(fù)功能,結(jié)合實(shí)例形式分析了AngularJS自定義過(guò)濾器的定義及數(shù)組過(guò)濾相關(guān)操作技巧,需要的朋友可以參考下2018-04-04
Spartacus CMS Feature selector的實(shí)現(xiàn)解析
這篇文章主要為大家介紹了Spartacus CMS Feature selector的實(shí)現(xiàn)解析,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-07-07
Angularjs中如何使用filterFilter函數(shù)過(guò)濾
這篇文章主要介紹了Angularjs中如何使用filterFilter函數(shù)過(guò)濾的相關(guān)資料,需要的朋友可以參考下2016-02-02
解決angularjs前后端分離調(diào)用接口傳遞中文時(shí)中文亂碼的問(wèn)題
今天小編就為大家分享一篇解決angularjs前后端分離調(diào)用接口傳遞中文時(shí)中文亂碼的問(wèn)題，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2018-08-08
這篇文章主要介紹了用AngularJs驗(yàn)證表單實(shí)例詳解的相關(guān)資料,需要的朋友可以參考下2016-05-05
這篇文章主要介紹了angular4+百分比進(jìn)度顯示插件用法,結(jié)合實(shí)例形式分析了Angular4安裝及使用百分比進(jìn)度顯示插件相關(guān)步驟與操作技巧,需要的朋友可以參考下2019-05-05
這篇文章主要介紹了Angular19 自定義表單控件的相關(guān)資料，非常不錯(cuò)，具有參考借鑒價(jià)值,需要的朋友可以參考下2018-01-01
淺談Angularjs中不同類(lèi)型的雙向數(shù)據(jù)綁定
這篇文章主要介紹了淺談Angularjs中不同類(lèi)型的雙向數(shù)據(jù)綁定，小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2018-07-07
這篇文章主要介紹了angular 內(nèi)存溢出的問(wèn)題解決，小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2018-07-07