angular父子组件传值和ngOnChanges的使用
父组件中定义: public detailbaseinfo = {}; //详情基本信息
其中detailbaseinfo 数据会通过请求获取
父组件传值给子组件如下:

子组件接收父组件传值
import { Component, Inject, OnInit, OnChanges, SimpleChange , Input, Output, EventEmitter } from '@angular/core';
@Component({
selector: 'app-introduce',
templateUrl: './introduce.page.html',
styleUrls: ['./introduce.page.scss'],
})
export class IntroducePage implements OnChanges {
@Input() detailbaseinfo: any; //接收课程信息
constructor(@Inject('urlConfig')private urlConfig) { }
ionViewWillEnter() {
}
ngOnChanges(changes:{[propKey:string]: SimpleChange }) {
this.detailbaseinfo = changes['detailbaseinfo']['currentValue'];
console.log(this.detailbaseinfo)
}
}
detailbaseinfo 在请求完成之前传给子组件的值为{},那么不符合实际需求,则需用到ngOnChanges去监听,当父组件中请求完成,detailbaseinfo 会被赋值,此刻才满足需求
angular父子组件传值和ngOnChanges的使用的更多相关文章
- Angular 父子组件传值
Angular 父子组件传值 @Input @Output @ViewChild 新建一个头部组件 newsheader 在主组件引用 news 组件,在news组件添加 newsheader 组 ...
- angular 父子组件传值 用get set 访问器设置默认值
private _PLACEHOLDER: string; @Input() public set placeholder(v: string) { this._PLACEHOLDER = v; } ...
- angular 4+中关于父子组件传值的示例
home.component.ts import { Component, OnInit } from '@angular/core'; @Component({ selector: 'app-hom ...
- vue 非父子组件传值
/*非父子组件传值 1.新建一个js文件 然后引入vue 实例化vue 最后暴露这个实例 2.在要广播的地方引入刚才定义的实例 3.通过 VueEmit.$emit('名称','数据') 4.在接收收 ...
- 使用react进行父子组件传值
在单页面里面,父子组件传值是比较常见的,之前一直用vue开发,今天研究了一下react的父子组件传值,和vue差不多的思路,父组件向子组件传值,父通过初始state,子组件通过this.props进行 ...
- 【vue】父组件主动调用子组件 /// 非父子组件传值
一 父组件主动调用子组件: 注意:在父组件使用子组件的标签上注入ref属性,例如: <div id="home"> <v-header ref="he ...
- vue父子组件传值加例子
例子:http://element-cn.eleme.io/#/zh-CN/component/form 上进行改的 父传子:用prop:子组件能够改变父组件的值,是共享的,和父操作是 ...
- Vue中非父子组件传值的问题
父子组件传值的问题,前面已经讲过,不再叙述,这里来说一种非父子组件的传值. vue官网指出,可以使用一个空vue实例作为事件中央线! 也就是说 非父子组件之间的通信,必须要有公共的实例(可以是空的), ...
- 创建组件的方法,组件的props属性、state属性的用法和特点,父子组件传值,兄弟组件传值
1.创建组件的方法 函数组件 class组件 1.1 函数组 无状态函数式组件形式上表现为一个只带有一个 `render()` 方法的组件类,通过函数形式或者 `ES6` 箭头 `functi ...
随机推荐
- Acwing43 不分行从上往下打印二叉树
地址 https://www.acwing.com/problem/content/description/41/ 从上往下打印出二叉树的每个结点,同一层的结点按照从左到右的顺序打印. 样例 输入如下 ...
- 2019-2020-1 20199305《Linux内核原理与分析》第六周作业
系统调用的三层机制(下) (一)给MenuOS增加命令 (1)打开虚拟机,首先用rm -rf menu指令删除当前的menu目录,然后用git clone重新克隆一个新版本的menu,进入menu,运 ...
- Apriori关联分析详解
------------恢复内容开始------------ 一. Apriori关联分析概述 选择物品之间的关联规则也就是要找出物品之间的关系,要找到这种关系有两步 找出频繁一起出现的物品集的集合, ...
- <DFS & BFS> 286 339 (BFS)364
286. Walls and Gates DFS: 思路是,搜索0的位置,每找到一个0,以其周围四个相邻点为起点,开始 DFS 遍历,并带入深度值1,如果遇到的值大于当前深度值,将位置值赋为当前深度值 ...
- codeforces 1260C. Infinite Fence (数学or裴蜀定理)
只需要验证小间隔在大间隔之间有没有连续的k个 设小间隔为a,大间隔为b,那么a在b之间出现的次数在\(\lfloor \frac{b}{a}\rfloor\)或者\(\lfloor \frac{b}{ ...
- 抓包工具之fiddler实战1-基本设置
Fiddler概述 百度搜索fiddler能找到官网网站,百度软件中心也提供了下载,本人去下载了基本和官网的版本一致,但还是建议大家下载软件一定去官网进行下载. Fiddler是干什么的 在百度百科里 ...
- linux 主机通过虚拟机(win10)上网
公司内网必须安装安全软件(exe)才可以上网,但是我的系统是deepin,用deepin-wine无法安软该exe,于是用vmware安装了win10虚拟机,通过虚拟机上网 先简单介绍下vmware以 ...
- C#上手练习1(if语句、Swich语句)
1.打印字符串. 2.调用简单方法,方法里有if语句.Swich语句. C# if else 语句是最常用的条件语句,并且 if else 语句的形式有多种,包括单一条件的 if 语句.二选一条件的 ...
- go-gui-控件和信号
go-gui-控件和信号 控件 控件简介 控件是对数据和方法的封装.控件有自己的属性和方法.属性是指控件的特征.方法是指控件的一些简单而可见的功能.如按钮就是一个控件,这个按钮是方形的,里面有张图片, ...
- cmd start命令启动文件的路径
最近在脚本中通过WScript.Shell执行命令行,实现IE打开Chrome的功能. JS代码如下: var singleurl = window.location.href; var isChro ...