AngularJS切换下拉菜单

我正在尝试使用AngularJS切换菜单项。我正在努力理解我做错了什么，因为下面的内容不起作用

<div ng-controller="firstController as firstCtrl">
    <button type="button" class="btn btn-default" aria-label="Menu" ng-click="firstCtrl.toggle(firstCtrl.navOpen)">
        <span class="glyphicon glyphicon-align-left" aria-hidden="true"></span>
    </button>
    <ul ng-show="firstCtrl.navOpen" class="nav nav-pills nav-stacked">
        <li>One</li>
        <li>Two</li>
    </ul>


    <p>{{firstCtrl.test1}}</p>
    <div ng-controller="secondController as secondCtrl">
        <p>{{secondCtrl.test1}}</p>
    </div>
</div>
<script src="app.js"></script>

}（））

---

我已经创建了一个plunk:

问题是您通过值将

firstCtrl.navOpen

传递给

toggle（）

，然后在函数内部操作新变量

navOpen

，但它永远不会被分配回视图正在使用的

firstCtrl.navOpen

请查看有关的文档，其中说明：

基本参数（如数字）通过值传递给函数；该值将传递给函数，但如果函数更改了参数的值，则该更改不会在全局或调用函数中反映出来

在您的例子中，参数是一个布尔值，也是基本值，因此按值传递

通过更改

元素，您可以让示例按预期工作，而无需调用函数：

<button class="btn btn-default" aria-label="Menu" type="button" ng-click="firstCtrl.navOpen = !firstCtrl.navOpen">

---

谢谢你的快速回复。无论如何，您的解决方案更优雅。我边做边学，边玩儿。有没有一种方法可以通过引用传递到函数中？如果我想在函数内部操纵“this.test1”，那该怎么办？再次感谢。我理解了通过值而不是引用传递的第一个有价值的点，现在您已经帮助我理解了我在函数调用中是如何做得不对的。我以前尝试过“this.toggle”，但我仍然试图通过引用传递变量。通过你的两个回答，我对我做错了什么有了更好的理解。非常感谢您的帮助。我不知道有什么方法可以通过引用传递原始数据。但您可以将其转换为一个对象，然后通过引用进行传递。i、 e.在firstController中声明

this.nav={open:true}

，然后您可以将对象

nav

传递给

toggle

函数（通过引用），并更改值，如

nav.open=！导航打开

。有道理吗？是的，有道理。再次感谢。有助于我的理解。

<button class="btn btn-default" aria-label="Menu" type="button" ng-click="firstCtrl.navOpen = !firstCtrl.navOpen">

this.toggle = function () {
    this.navOpen = !this.navOpen;
};