Question

所以我在ng-repeat列表中设置了一个自定义过滤器，我可以使用同一页面的不同按钮动态更改。

我的问题是，如何更改此过滤器，其值超出页面。

为了澄清，我在我的＆list; view.view.html＆＃39;上有一个ng-repeat列表。我希望能够在我的主页上按一个按钮，其中包含一个过滤值，并加载＆＃39; list.view.html＆＃39;过滤后的结果，包括我主页上按钮的参数。

进一步迭代，

在list.view.html上的ng-repeat之上，我包含了这样的按钮：

<button class="sortBy" ng-click="myFilter =  { statusOpen : true }">Open</button>

将ng-repeat更新为仅包含statusOpen布尔值为true的项目。

这是我的ng-repeat

中的过滤器

<li class="list-group-item animate-repeat" data-ng-repeat="task in vm.tasks | filter:search | filter:myFilter>

如何通过点击主页上的一个按钮来获得相同的结果，该按钮路由到带有过滤结果的list.view.html页面？

我已经尝试在list.view.html的控制器中设置一个param过滤器，但是我无法让它工作。

例如我的主页上的<a ui-sref="tasks.list({ myFilter = { onlineTask : 'true' } })">和我的client.routes.js上的::

 params: {
       myFilter: null
 }

控制台错误消息

angular.js：11706错误：[$ parse：syntax]语法错误：令牌＆＃39; =＆＃39;是意料之外的，期待表达式[{myFilter = {onlineTask：＆＃39; true＆＃39;从[= {onlineTask：＆＃39; true＆＃39; }}。 http://errors.angularjs.org/1.3.20/ $解析/语法P0 =％3D＆安培; P1 =是％20unexpected％2C％20expecting％20％5B％3A％5D＆安培; P2 = 12＆安培; P3 =％7B％20myFilter％20％3D％20％图7B＆＃34;

我正在寻找一些关于如何处理这个问题的大方向。

非常感谢

Answer 1

我认为在angular-ui过滤器中设置所需的参数是实现你想要的最佳方式。

你必须记住：

正确设置URL（在URL中包含param）并使用yout控制器中的$stateParams服务处理params。如果您有多个过滤器，则可以使用数组：

$stateProvider
.state('search', {
  url: "/search/?myFilter",
  templateUrl: 'search.html',
  controller: function ($stateParams) {
  // Get filter(s)
   console.log($stateParams.myFilter);
  }
})

在ui-sref中正确分配参数（使用冒号！）：

<a ui-sref="filter({ myFilter: ['filter1','filter2'] })">Go and filter</a>

参见示例：http://plnkr.co/edit/QOHNYHVPRJ8iBm3Adjcj?p=preview

使用来自ui-sref的参数动态更改ng-repeat过滤器

1 个答案: