美文网首页
4.组件传值 - set及get

4.组件传值 - set及get

作者: 嗨姑娘_大个子 | 来源:发表于2018-10-31 15:01 被阅读0次

参考:https://blog.csdn.net/kuangshp128/article/details/71172934/

1. angular6 组件之间传值的几种方式:
  • 父组件通过属性绑定到子组件,子组件通过事件传递参数到父组件
  • 父组件通过局部变量获取子组件的引用
  • 父组件使用@ViewChild获取子组件的引用
  • 两个不相关联的组件使用中间人模式交互
  • 终极大招:创建一个服务注入到组件中
  • 直接把父组件当做服务注入到子组件中
二. setget方法 :父组件传递数据到子组件,子组件接受数据,对其接收的数据进行处理再显示
// 父组件 ts
data:string = "parent";  // 传递一个parent给子组件

// 父组件 html
<app-comdemo01 [input]="data"></app-comdemo01>
//子组件ts文件
export class Comdemo01Component implements OnInit {
  _input: string;
  @Input()
  public set input(v: string) {
    this._input = v.toUpperCase();  //转换大写输出
  }
  public get input(): string {
    return this._input;
  }
  constructor() {
  }
  ngOnInit() {
  }
}

//子组件html代码
I am fron {{input}}

相关文章

  • 4.组件传值 - set及get

    参考:https://blog.csdn.net/kuangshp128/article/details/7117...

  • 【Vue3 从入门到实战 进阶式掌握完整知识体系】011-探索组

    2、组件间传值及传值校验 父组件给子组件传值 运行结果 父组件给子组件传动态参数 运行结果 子组件校验父组件的传参...

  • 使用koa做一个简单的接口及获取数据

    1.先安装koa-router 2.使用 3.定义路由 4.获取请求数据 GET 传值 Koa 中 GET传值通过...

  • vue2 父子模版组件之间的传值

    1. 父组件传值给子组件 子组件先定义好需要父组件传的值及如何使用 文件名TestFatherToSon.vue ...

  • vue父子组件传值

    在vue中父子组件的传值,是我们必须要get的知识点,今天再做一个详细的总结。 1)父组件向子组件传值 父组件向子...

  • Vue3.2组件间通信

    组件之间的传值及通信 一、第一种场景 两层组件之间传值和监听值改变 二、第二种场景 多层组件间传值和监听值改变父组...

  • Vue - 传值

    Vue 传值有两种:1)父组件向子组件传值(属性传值,Prop传值)2)子组件向父组件传值 一、父组件向子组件传值...

  • 组件之间的传值

    组件之间的传值,包括父子组件传值,兄弟组件之间的传值,其中父子组件包括父组件向子组件传值和子组件向父组件传值,现在...

  • Vue_组件间传值

    1、父组件传值给子组件2、子组件传值给父组件 1、父组件传值给子组件 2、子组件传值给父组件

  • Vue组件化常用技术

    组件传值、通信 父组件=>子组件 1.属性props 2.引用refs 3.子组件children 4.子组件 =...

网友评论

      本文标题:4.组件传值 - set及get

      本文链接:https://www.haomeiwen.com/subject/oojatqtx.html