布尔值未在Angular中传递

Question

我正在尝试做相对简单的事情，将布尔变量multiExpandable传入我的指令创建的递归树。 稍后由我的服务评估该变量。 在我的服务中，无论出于何种原因，它都会以未定义的形式返回。

我不知道为什么要这样对我！ 应用程序变量接受字符串对象，并且在字面上做相同的事情，并且绝对可以。 我的代码在下面，请注意，其中的许多内容已被裁剪以仅向您显示重要内容。 为什么会这样呢？

我的指令：

.directive("navigation", function() {
          return {
                restrict: 'E',
                replace: true,
                scope: {
                    menu: '=',
                    multiExpandable: '=',
                    application: '=',
                },
                controller: function($scope) {
                    $scope.toggleExpand = NavigationService.toggleExpand;
                },

              ...

            }

我的模板：

<ul style="list-style: none">
<li ng-repeat="node in menu.Folders">
    {{multiExpandable}}
    <i class="fa" ng-click="toggleExpand(node, application, menu, multiExpandable)"></i>
    <navigation menu="node" application="application" multiExpandable="multiExpandable"    ng-show="node.expanded == true"></navigation>
</li>
</ul>

指令被调用的位置：

<navigation class="nav tree" menu="applications[currentApplication].Menu" application="currentApplication" multiExpandable="expandable"></navigation>

以及服务中的值（控制台日志语句将其作为未定义返回）：

_toggleExpand = function (application, multiExpandable) {

                    //some code

                    console.log("in TOGGLE EXPAND - multiExpandable:");
                    console.log(multiExpandable);

                    //some code
 }

Answer 1

您的指令属性声明为camelCase，因此您需要在HTML中使用破折号，如下所示：

multi-Expandable="multiExpandable"

注意角度：

• 从HTML元素/属性的前面去除x和data-，然后
• 将带有: ， -或_分隔名称的HTML属性转换为camelCase。

你可以在这里读更多关于它的内容：

https://docs.angularjs.org/guide/directive