相关疑难解决方法(0)

我一直在将自定义指令升级到新的组件架构.我读过组件不支持观察者.它是否正确？如果是这样,您如何检测对象的更改？对于一个基本的例子,我有自定义组件myBox,它有一个带有游戏绑定的子组件游戏.如果游戏组件中有更改游戏,我如何在myBox中显示警告消息？我明白有rxJS方法是否有可能纯粹在棱角分明？我的JSFiddle

JavaScript的

var app = angular.module('myApp', []);
app.controller('mainCtrl', function($scope) {

   $scope.name = "Tony Danza";

});

app.component("myBox",  {
      bindings: {},
      controller: function($element) {
        var myBox = this;
        myBox.game = 'World Of warcraft';
        //IF myBox.game changes, show alert message 'NAME CHANGE'
      },
      controllerAs: 'myBox',
      templateUrl: "/template",
      transclude: true
})
app.component("game",  {
      bindings: {game:'='},
      controller: function($element) {
        var game = this;


      },
      controllerAs: 'game',
      templateUrl: "/template2"
})

HTML

<div ng-app="myApp" ng-controller="mainCtrl">
  <script type="text/ng-template" id="/template">
    <div style='width:40%;border:2px solid black;background-color:yellow'> …

我正在以这种方式制作一个包含3个子组件的组件:

<header-component>
<side-component>
<main-component>

主要组件包含英雄列表.标头组件包含两个按钮,用于将主组件上的视图切换到列表或网格视图.

我现在遇到的问题是将数据从header-component传递到main组件.因此,当我单击网格按钮时,主内容上的视图应更改为网格视图,对于行视图也是如此.

如何在角度1.5的子组件之间传递数据？