Angularjs 当另一个控制器中发生单击事件时，如何在一个控制器中显示数据？_Angularjs

Angularjs 当另一个控制器中发生单击事件时，如何在一个控制器中显示数据？

angularjs

Angularjs 当另一个控制器中发生单击事件时，如何在一个控制器中显示数据？,angularjs,Angularjs,我是angular.js的新手。我只想在单击“ControllerA”中的按钮时显示“欢迎”消息，即“ControllerB”。我用“服务”试过了，但我不知道怎么做。以下是我的HTML代码： <body ng-app='myApp'> <script src="js/angular.js"></script> <script src="script/service.js"></script> <div n

我是angular.js的新手。我只想在单击“ControllerA”中的按钮时显示“欢迎”消息，即“ControllerB”。我用“服务”试过了，但我不知道怎么做。以下是我的HTML代码：

<body ng-app='myApp'>
    <script src="js/angular.js"></script>
    <script src="script/service.js"></script>
    <div ng-controller='contA'>

        <input type="button" ng-click="clicked()" value="Click">

    </div>
    <div ng-controller='contB'>
        <div ng-show="clickShow">
            <h1>Welcome</h1>
        </div>
    </div>
</body>

您必须直接绑定到服务对象的

disp

属性，因为

scope.clickShow

本身不会更改-服务

disp

和scope

clickShow

之间没有连接

因此，您可以将服务对象直接公开到模板中：

var app = angular.module('myApp',[]);

app.controller('contA', ['$scope', 'displayServ', function(scope,displayServ){        
    scope.clicked = function(){
        displayServ.disp = true;            
    }
}]);

app.controller('contB',['$scope', 'displayServ', function(scope,displayServ){        
    scope.displayServ = displayServ;       
}]);

app.service('displayServ', function(){
    this.disp = false;
});

然后在模板中：

<body ng-app='myApp'>
    <script src="js/angular.js"></script>
    <script src="script/service.js"></script>
    <div ng-controller='contA'>
        <input type="button" ng-click="clicked()" value="Click">    
    </div>
    <div ng-controller='contB'>
        <div ng-show="displayServ.disp">
            <h1>Welcome</h1>
        </div>
    </div>
</body>


欢迎

否则，您将不得不使用

作用域。$watch

，但在这种情况下，不建议这样做。

您可以使用$Broadcast在其他控制器中显示效果

可能的副本：。

<body ng-app='myApp'>
    <script src="js/angular.js"></script>
    <script src="script/service.js"></script>
    <div ng-controller='contA'>
        <input type="button" ng-click="clicked()" value="Click">    
    </div>
    <div ng-controller='contB'>
        <div ng-show="displayServ.disp">
            <h1>Welcome</h1>
        </div>
    </div>
</body>