angularjs:将过滤后的数组传递给指令

2023-12-01

我正在寻找一种将过滤后的数组传递给指令的方法:

我尝试过以下方法:

<my-directive model="myArray | filter:{myProperty: 'some value' }" /> 

但这不起作用。我认为它应该与 ng-repeat 一起使用,因为在这里我只是传递一个函数而不是过滤后的数组。

除了制作数组的过滤副本之外,还有其他方法可以做到这一点吗?

EDIT

这是完整的代码:

<request-service type="editing" jobs="vm.selectedMaterial.jobs | filter:{service.code: 'ED'}"></request-service>
<request-service type="translation" jobs="vm.selectedMaterial.jobs | filter:{service.code: 'TR'}"></request-service>

和指令:

(function () {
'use strict';

var directiveId = 'requestService';

angular.module('comp.domain.directives').directive(directiveId,  [directiveFunc]);

function directiveFunc(dependency) {
    return {
        restrict: 'E',
        templateUrl: 'app/dm/views/templates/requestService.html',
        scope: {
            type: '@',
            jobs: '='
        },
        link: function (scope, element, attrs) {                
        }
    };
}
})();

这样做时,我收到错误“将循环结构转换为 JSON”

EDIT 2

按照建议的解决方案,我这样做了:

 $scope.filterJob = function (type) {
        if ($scope.vm.selectedMaterial) {
            return $scope.vm.selectedMaterial.jobs.filter(function (job) { return job.service.code === type; });
        };
    }

并在视图中:

  <request-service type="ED" jobs="filterJob('ED')"></request-service>

但这仍然给我同样的错误。


你的两个问题都是相互关联的。

您可以在 ng-model 上应用过滤器,但您不应该这样做。因为它会给你在第二个问题中遇到的错误。

当您将过滤器作业传递给您的指令时,Angular 会在您的作业变量上放置一个监视。因此,当在指令中分配作业时,手表将被调用,这将再次触发过滤器,并且这将持续下去,直到角度达到最大摘要周期。

为了避免这种情况,您可以创建一个过滤器方法并将该方法传递到 ng-model 中。这样您就可以避免副本创建和最大摘要周期错误。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

angularjs:将过滤后的数组传递给指令 的相关文章

  • Promise.all 返回一个未定义的数组并在完成之前解析

    我在返回数组的函数时遇到问题undefined 这是代码 classMethods getQueries function models dbId dateStart dateEnd return new Promise function
  • 禁用 Ctrl + 滚动以缩放谷歌地图

    Does anybody know how to disable the CTRL Scroll First when the mouse wheel was moved the Map would Zoom in out But now
  • ExtJs4 Json TreeStore?

    我正在将 ExtJs3 应用程序迁移到 ExtJs4 在 ExtJs3 中 我有一个树网格 它有一个加载器来加载树数据 如下所示 loader new Ext tree TreeLoader dataUrl Department Depar
  • 使用 JS 和 HTML 将当前 URL 插入链接

    所以 我已经阅读了类似的内容 但我仍然找不到更适合我正在做的事情的答案 我正在尝试使用 JS 获取当前页面 URL 并将其附加到社交媒体共享链接 如下所示 a href target blank 使用 Javascript 我成功地将当前
  • 当列表包含图像时,React Native FlatList 感觉很慢

    我为 avater 使用 64x64 图像 它的尺寸非常小 通过我的应用程序 滚动时帧率下降至 25 35 fps 如何优化 flatList 图像
  • .getDay() 奇怪的行为[重复]

    这个问题在这里已经有答案了 有一个例子 console log new Date 2013 02 24 getDay 24 gt 0 24 console log new Date 2013 02 25 getDay 25 gt 1 25
  • Mocha / Chai Expect.to.throw 未捕获抛出的错误

    我在获取 Chai 时遇到问题expect to throw测试我的 node js 应用程序 测试在抛出的错误上不断失败 但是如果我将测试用例包装在 try 和 catch 中 并对捕获的错误进行断言 它就会起作用 Does expect
  • JavaScript 函数参数和范围

    我用下面列出的代码做了一些测试 function foo x alert y var y I am defined outside foo definition foo 上面的代码给了我一个警告 我是在 foo 定义之外定义的 然后另一个测
  • 错误:导航器只能包含“屏幕”组件作为其直接子组件

    我是 React Native 新手 收到此错误 但无法解决它 我正在遵循主要的教程反应导航页面 https reactnavigation org docs screen options resolution 但我无法完成它 我将不胜感激
  • 如何从回调函数中获取值

    我对 javascript 比较陌生 并且面临一些困难 我有两个 java 脚本文件 如下所示 我无法获取变量的值条目标题在 getRss 函数内并将其存储在变量内Rss1 标题 and Rss2 标题 创建一个全局变量并将其分配给条目标题
  • 如何防止缓慢脚本警告并强制浏览器继续运行脚本直到完成?

    更新 2013 年 7 月 5 日 自从我最初问这个问题以来 我学到了很多东西 在下面的一条评论中 有人建议我重新处理该任务 并找到一种方法来解决它 而不会有阻塞 UI 的风险 我说不可能 函数必须按原样运行 我实际上不记得我试图用这个函数
  • 不明白为什么 Chrome/Safari 无法在此处获取 ScrollHeight

    我只是问了一个问题 为什么某些 js 代码不能 100 在 Chrome 和 Safari 中工作 但经过更多故障排除后 我想我发现这是我应该发布的问题 我有一个页面 其中有一个表单 该表单的目标是同一页面上的 iframe iframe
  • Node.JS Web 服务器中的安全性

    所以 我正在学习 Node JS 到目前为止我很喜欢它 我已经有几个项目在工作了 我想我可以在其中使用nodejs 不过 我担心安全问题 如果我使用 Node JS http 模块编写自定义 Web 服务器 我是否可能非常容易受到攻击 Ap
  • 如何切换整个页面的深色主题?

    我已经成功地在 html 和 Flask 中按下复选框时切换深色主题和浅色主题 但是我怎样才能让深色主题覆盖整个页面 而不仅仅是一些 div 元素呢 边距仍然是浅色主题 CSS代码如下 container display flow widt
  • 如何使 Loopback 模型事件起作用?

    我尝试过一个例子http apidocs strongloop com loopback model http apidocs strongloop com loopback model MyModel on changed functio
  • 如何从 dataurl 在服务器上创建图像文件

    我有一个 dataurl 格式的图像 例如 data image jpeg base64 9j 4AAQSkZJRgABAQAAAQABAAD 2wBDAAMCAgMCAgMDAwMEAwME iiigAooooAKKKKACiiigAoo
  • 将回调函数与原型函数一起使用

    在执行回调时 我无法弄清楚如何传递对象方法而不是排序 通用原型 方法 function Client this name hello Client prototype apiCall function method params callb
  • 使用 Java 进行 AES 加密并使用 Javascript 进行解密

    我正在制作一个需要基于 Java 的 AES 加密和基于 JavaScript 的解密的应用程序 我使用以下代码作为基本形式进行加密 public class AESencrp private static final String ALG
  • JavaScript 不是 DOM 的一部分吗?

    为什么即使从 DOM 中删除用于创建脚本的代码 脚本仍然可以运行 我遇到了一种情况 我想阻止损坏的脚本运行 查看我的帖子 https stackoverflow com questions 2685581 is there a way to
  • 获取不正确的日期,将时间戳转换为新日期

    我正在尝试将时间戳转换为日期 但得到的日期不正确 我正在开发一个使用 Angular 和 Typescript 的项目 我有这样的时间戳 1451642400 2016年1月1日 和1454320800 2016年2月1日 如果我编码 da

随机推荐