Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/371.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 动态AngularJS过滤器_Javascript_Angularjs_Filter_Angularjs Ng Repeat_Angularjs Filter - Fatal编程技术网

Javascript 动态AngularJS过滤器

Javascript 动态AngularJS过滤器,javascript,angularjs,filter,angularjs-ng-repeat,angularjs-filter,Javascript,Angularjs,Filter,Angularjs Ng Repeat,Angularjs Filter,我有一个动态导航菜单,对应于传递到表格创建中的各种过滤器,根据按下的按钮过滤表格中的内容 我在$scope中有一个名为$scope.uniqueFilter的变量。选择的过滤器取决于按下的按钮。在链接的ng click上,我定义了一个函数,该函数接受按钮参数的输入,将其传递到此函数,然后将$scope.uniqueFilter设置为与按钮的特定过滤方法相等 Onclick,我已经能够按预期通过所需的过滤器,但它们不仅没有应用于内容,而且完全阻止了表的创建 我要重复的行的内容如下所示: <t

我有一个动态导航菜单,对应于传递到表格创建中的各种过滤器,根据按下的按钮过滤表格中的内容

我在$scope中有一个名为
$scope.uniqueFilter
的变量。选择的过滤器取决于按下的按钮。在链接的
ng click
上,我定义了一个函数,该函数接受按钮参数的输入,将其传递到此函数,然后将
$scope.uniqueFilter
设置为与按钮的特定过滤方法相等

Onclick,我已经能够按预期通过所需的过滤器,但它们不仅没有应用于内容,而且完全阻止了表的创建

我要重复的行的内容如下所示:

<tr class="progress" ng-repeat="idea in ideas | filter:uniqueFilter" >
<div class="nav">
    <div ng-controller="NavController">
      <p ng-repeat="link in links">
        <block class="button" href="{{link.URL}}" title="{{link.name}}">
          <a href="{{link.URL}}" ng-click="getFilter(link.show)">
            {{link.name}}
          </a>
        </block>
      </p>
  </div>
</div>
DataFactory,填充表的内容:

app.factory('DataFactory', function(){
    return [
        {'title':'Title1',
        'A': '80',
        'B': '6',
        'active': true //this is what should determine if it shows or not
        },
       {'title':'Title2',
        'A': '80',
        'B': '6',
        'active': true
        },
        {'title':'Title3',
        'A': '80',
        'B': '6',
        'active': false
        },
    ];
});
我觉得我遗漏了一些明显的东西,但我想我对Angular的理解不够透彻,无法找到它。 谢谢你能给我的帮助

编辑

所以我提出了一些更新建议

以下是我的ng repeat标记的更好视图:

<table>
    <tr class="title_bar">
        <td>Title</td>
        <td>A</td>
        <td>B</td>
    </tr>

    <tr class="progress" ng-repeat="idea in ideas | filter:uniqueFilter">
<!-- uniqueFilter here does nothing, and {value:true} stops values from appearing,
 but {active:true}(and false) works. But I need this filter to change based on what
 is clicked, hence why I want uniqueFilter to work -->
        <td>{{idea.title}}</td>
        <td>{{idea.A}}</td>
        <td>{{idea.B}}</td>
    </tr>
</table>

你很接近。您没有显示ng repeat,但基本上您只想确保正确设置uniqueFilter的措辞

{   'name':'Active',
    'URL': '#/active',
    'show': { active:true } // <-- this is what you'd pass to your "filter:" expression
},
{   'name':'Complete',
    'URL': '#/active', 
    'show': { active:false } // <-- this is what you'd pass to your "filter:" expression
}
{'name':'Active',
“URL”:“#/active”,

'show':{active:true}//uniqueFilter变量似乎不起作用。我已经能够让过滤器使用{active:true}和{active:false}硬编码(因此现在我知道我的其余代码与此相关没有bug),但uniqueFilter不会影响表。我只是更新了问题中的代码以向您展示我的最新编辑。有什么想法吗?您可以使用引号/不使用引号进行编辑,两种方法都有效。看看这个示例:我做的基本上与您在这里做的相同,一定有一些细微的差异导致它不适用于您。我在这里循环过滤器&然后单击设置新的过滤器。我正在Plunker中测试它(因为$routeProvider需要AJAX请求,我不能在本地测试它),出于某种原因,您的确切代码在JSFIDLE上工作,而不是在Plunker上。我修改了它,使其与我的代码完全匹配,并且它工作!但在Plunker中不工作。我想这是一个Plunker问题,而不是我这边的角度问题。对我的应用程序进行bug是一件多么愚蠢的事情……感谢您的帮助!!我很高兴您能够帮助我使其工作。嘿,太好了!很高兴帮助。布尔过滤器困扰了我一段时间,直到我意识到如何使用它们!幸运的是,您现在再也不会遇到这个问题:)
$scope.links = [
    {'name':'About', //title that will be displayed on the link
    'URL': '#/about', //URL/view that the link will lead to/show
    'show':'(not actually a filter here)' //view may simply change so some info is hidden or revealed
    },
    {'name':'Active',
    'URL': '#/active',
    'show': {'active': true}  //unsure if this needs to be 'active' or active without quotes; in the DataFactory, it's in quotes
    },
    {'name':'Complete',
    'URL': '#/active',
    'show':{'active': false}
    }
];
{   'name':'Active',
    'URL': '#/active',
    'show': { active:true } // <-- this is what you'd pass to your "filter:" expression
},
{   'name':'Complete',
    'URL': '#/active', 
    'show': { active:false } // <-- this is what you'd pass to your "filter:" expression
}
<li ng-repeat="item in items | filter: uniqueFilter">

// which for example would translate into:
<li ng-repeat="item in items | filter:{value:true}"> // or
<li ng-repeat="item in items | filter:{value:false}"> 
// allowing it to work with boolean values