Question

我试图与2个控制器互相交谈，但我遇到了2个问题/问题：

$ scope.display在我的视图中不会首先显示。我想知道为什么。
$ scope.display似乎在2个控制器之间共享，而我读取$ scope（s）是隔离的。我想知道为什么。
我在stackoverflow上读到最好的控制器之间的通信是使用$ rootScope.broadcast＆amp; $ rootScope.on。这适用于此示例吗？

JS

angular.module("superApp", [])
    .controller("headerCtrl", function ($scope) {
        $scope.display = 'hello';
    })
    .controller("homeCtrl", function ($scope) {

    });

HTML

<div ng-app="superApp">
    <div ng-ctrl="headerCtrl">
        <p>{{ display }}</p>
        <div class="bar hello" ng-show="display == 'hello'"> 
            <span>Hello World<span>
            <button ng-click="display = 'bye'">Say bye</button>
        </div>
        <div class="bar bye" ng-show="display == 'bye'">
            <span>Bye Bye</span>
            <button ng-click="display = 'hello'">Say hello</button>
        </div>
    </div>
    <div ng-ctrl="homeCtrl" class="content">
        <button ng-click="display = 'bye'">Say bye</button>
        <button ng-click="display = 'hello'">Say hello</button>
    </div>
</div>

我想我错过了一些东西......这里有jsfiddle来测试。

Answer 1

您想使用ng-controller而不是ng-ctrl。

<div ng-controller="headerCtrl">

和

<div ng-controller="homeCtrl" class="content">

为什么你的代码“正常”？

使用这些指令时没有声明的控制器及其相关范围：

ng-click="display = 'bye'"
ng-show="display == 'hello'"

您基本上会影响$ rootScope变量，并在$ rootScope中设置一个新的var'display'，其中包含每次点击的值。这就是为什么它只在第一次点击后显示，并且在您最初查看页面时不显示。您的控制器都没有被实际使用。

请参阅：AngularJS Documentation for $rootScope

Answer 2

问题在于ng-ctrl指令，应该是ng-controller

    <div ng-controller="homeCtrl" class="content">

与$ scope＆amp;相关的问题控制器

2 个答案:

为什么你的代码“正常”？