javascript - 数组作为字符串传递给自定义指令

标签 javascript angularjs angularjs-directive

我创建了具有独立作用域的 cusotm 指令。但是当我传递给我的数组类型的指令变量时,我在指令中得到了字符串。

我的指令:

angular.module('my.directives')
    .directive('testDirective', [function() {
        return {
            restrict: 'A',
            replace: true,
            scope: {
                myArray: '@'
            },
            controller: function($scope) {
                alert("Is arr: " + angular.isArray($scope.myArray)); // outputs false                 
            }
        };
    }
]);

用法:

<div ng-repeat="currentObject in list">
    <div test-directive my-array="{{currentObject.arrayOfNumbers}}"></div>
</div>

变量 currentObject.arrayOfNumbers 是类型数组的 100% - 我使用 angular.isArray 方法在我的 Controller 中检查了它,但是当在指令中传递它时我得到只是一个字符串。

即如果

currentObject.arrayOfNumbers = [1,2,3,4]

然后内部指令我有完全相同的字符串:[1,2,3,4]"

最佳答案

那是因为你没有正确使用双向绑定(bind)。您正在通过以下方式设置属性 my-array 的文本:-

<div test-directive my-array="{{currentObject.arrayOfNumbers}}"></div>

将其更改为:-

<div test-directive my-array="currentObject.arrayOfNumbers"></div>

这样对象将正确绑定(bind)到指令中的 2 路绑定(bind)范围变量。

并将 myArray: '@' 更改为 myArray: '=' :-

如果你正在做 myArray:'@' 这是文本绑定(bind)然后做 JSON.parse($scope.myArray)$scope.$eval ($scope.myArray))

Demo

关于javascript - 数组作为字符串传递给自定义指令,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25409497/

相关文章:

angularjs-directive - 仅适用于属性的 Angular 指令在 React 中的等价物是什么?

angularjs - 基本的 AngularJS NVD3 指令将不起作用且没有错误

javascript - 基于 Jquery、JS 中解析的 CSV 文件,使用 JSON 数据填充表

javascript - 用AngularJS分两步记录数据

javascript - 如何使用angularjs检查所选时间小于当前时间或大于当前时间?

javascript - 单击元素,直到使用 isDisplayed 显示另一个元素

angularjs - Angular - 让 ng-bind 处理嵌套指令

javascript - Angular Material - $mdDialog 自定义模板 - ng-click 指令中的函数?

javascript - 从 phantomjs 网络服务器返回二进制结果

javascript - 为什么链接需要在手机上双击才能进入链接?