两个控制器，角度范围内的一个变量

好吧，所以我有两个控制器控制站点的两个截然不同的部分，它们在同一页上。两个控制器，角度范围内的一个变量

第一个是通讯注册表单，第二个是一个篮子。第二个不是直接作为ng-controller指令放置在DOM中，而是作为自定义指令的控制器。

一些代码：

<div ng-controller="newsletter-signup"> 
    <div ng-show="showLoader"> 
     ... Cool loading animation here ... 
    </div> 

    ... Form in here ... 
</div> 

<div basket> 
    <div ng-show="showLoader"> 
     ... Cool loading animation here ... 
    </div> 

    ... Basket data in here ... 
</div>

，我有是，这两个包含div，我只希望在一定条件下显示出来，这个div被存储在一个模板文件中的问题：

<div ng-show="showLoader"> 
    ... Cool loading animation here ... 
</div>

然而，当这两个控制器中的任一控制器中的$scope.showLoader是true时，在通讯和篮子中都显示这个。

我似乎无法弄清楚如何隔离对方的范围，但继续使用相同的变量名称。

篮子指令如下：

return { 
    link : linkFn, 
    scope: '=', 
    restrict : 'A', 
    controller : 'BasketController' 
};

BasketController在模板从未定义。

我该如何解决这个问题？

我不希望div的新闻通讯显示何时正在更新购物篮，同样，我不希望div在更新通讯时显示。

编辑：我们正在使用以下来定义组件，我想知道这是否是根本原因。

window.angular.module('Basket', []); 
window.angular.module('App', ['Basket']);

来源

2015-07-03 Alex McCabe

在一个指令，你可以使用'范围：{}'创建一个孤立的范围。但是篮子指令是否有模板？根据你发布的内容，我不明白它的作用。 – jme11

篮子是附加到某些动态内容的环绕'div'的属性。它没有它自己的模板。我会更新更清晰。 –

这两个div是否有一个共同的父亲，其范围也可能包含一个“showLoader”变量？ –

由@ jme11发布，您需要将范围键传递给对象才能获得隔离范围。

在这两个地方的变量是不同的，因此定义的第一个地方可以是真或假。然而，第二个地方与孤立的范围，除非我们直接传递它的变量，它将保持未定义，这是JS中的一个虚假值，因此ng-show将不会通过。

这里是为了说明问题更好的笔......

return { 
    link : linkFn, 
    scope: { 
     showLoader: '=' 
    }, 
    restrict : 'A', 
    controller : 'BasketController' 
};

http://codepen.io/stenmuchow/pen/BNrLZm?editors=101

来源

2015-07-06 08:44:40

谢谢你的帮助，但我仍然遇到一些问题。孤立的范围导致了我迄今为止尝试使用Angular的所有事情中遇到的最大麻烦。我叉了你的笔，并改变了一些东西，以接近我使用它，但我无法想象它：http://codepen.io/alexmccabe/pen/BNrLrY –

请参阅编辑，看看是否这可能是问题的一部分？ –

超级关闭，但独立作用域也适用于函数以及变量！哎呀，我不小心覆盖了笔......但无论如何，忘记了孤立的范围cuz它不需要，只是让更多的困惑。 http://codepen.io/stenmuchow/pen/KpogJJ –

两个控制器，角度范围内的一个变量

回答

相关问题