博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
Angularjs Controller间通信的几种方法
阅读量:6947 次
发布时间:2019-06-27

本文共 1360 字,大约阅读时间需要 4 分钟。

先说最简单的,适合简单数据

一、使用controller as

     {
{parent.name}}
{
{child.name}} - {
{parent.name}}

这样parentCtrl中的数据也可以显示在嵌套在其中的childCtrl了

二、使用$rootScope 或 $parent

     {
{name}}
{
{name}} - {
{$parent.name}}

三、使用$broadcast,$emit和$on

  • 从上往下—— $broadcast 把事件广播给所有子controller
  • 从下往上—— $emit 将事件冒泡传递给父controller
  • $on     ——  angularjs的事件注册函数
name :
Ctr1 name:
angular.module("app", []).controller("parentCtrl",function ($scope) {    //注册Ctrl1NameChange事件    $scope.$on("Ctrl1NameChange", function (event, msg) {        console.log("parent", msg);        $scope.$broadcast("Ctrl1NameChangeFromParent", msg);    });}).controller("childCtrl1", function ($scope) {    $scope.change = function (name) {        console.log("childCtrl1", name);         //冒泡Ctrl1NameChange事件,将name传给父级controller        $scope.$emit("Ctrl1NameChange", name);    };}).controller("childCtrl2", function ($scope) {    //    $scope.$on("Ctrl1NameChangeFromParent",function (event, msg) {        console.log("childCtrl2", msg);        $scope.ctrl1Name = msg;    });});

jsfiddle链接:

参看:

  • http://www.cnblogs.com/whitewolf/archive/2013/04/16/3024843.html
  • http://stackoverflow.com/questions/21287794/angularjs-controller-as-syntax-clarification
你可能感兴趣的文章
Kettle5.4实战项目培训课程
查看>>
获取局域网里一个MAC地址对于的IP地址
查看>>
让phpmailer支持中文名称的附件和邮件标题中文乱码(转)
查看>>
JavaScript强化教程——JavaScript Math(算数) 对象
查看>>
CentOS7部署Kubernetes集群
查看>>
struts2中使用DMI(动态调用方法)方式配置action
查看>>
使用hyperpacer实现AWR报告的同步收集
查看>>
关于os.popen你可能不知道的
查看>>
redhat5.3恢复***
查看>>
linux 下mysql的乱码问题
查看>>
门面模式/Facade
查看>>
webService客户端参数为DataHandler类型时候的参数组装
查看>>
遗传算法入门--连载3
查看>>
【安全牛学习笔记】信息收集--DNS
查看>>
Linux 第11天: (08月17日) 练习和作业
查看>>
Install Latest Versions NodeJS NPM on ubuntu
查看>>
Linux常用命令——crontab
查看>>
Discuz! X2 下 URL 静态化的实现方法
查看>>
mongodb删除重复数据
查看>>
项目中常用的第三方框架总结
查看>>