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

不在Angular中传递的布尔值

1 个答案: