简体   繁体   English

独特的过滤器在Angular.js中无法正常工作

[英]unique filter not working properly in Angular.js

I have a simple example where I am exptecting my paragraphs to filter out values based on unique age, but I get the unknown provider error. 我有一个简单的例子,我在检查我的段落以根据独特的年龄筛选出值,但是我得到了未知的提供程序错误。 How ? 怎么样 ?

<html>
<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.8/angular.min.js"></script>
</head>
<body ng-app="myApp" ng-controller="myCtrl">
    <p ng-repeat="x in persons | unique: 'age'">{{x.name}}</p>
<script>
//App declaration
var app = angular.module('myApp',[]);
//Controller Declaration
app.controller('myCtrl',function($scope){
    $scope.persons = [{name: "Peter",age:23},{name:"Laila",age:25},{name:"Rosy",age:23}];
});
</script>
</body> 
</html> 

在此输入图像描述

That because the unique filter can currently be found as part of AngularJs UI Utils. 因为独特的过滤器目前可以作为AngularJs UI Utils的一部分找到。 To make this work you must include it as an additional reference in your module angular.module('myApp', ['ui', 'ui.filters']); 要使其工作,您必须将它作为附加参考包含在您的模块angular.module('myApp', ['ui', 'ui.filters']);

Hope this help you. 希望这对你有所帮助。

You need to inject 'ui.directives' and 'ui.filters' module to your app 您需要将“ui.directives”和“ui.filters”模块注入您的应用程序

var app = angular.module('myApp',['ui.directive', 'ui.filters']);

Since ui.directives and ui.filters modules are present in AngularUI, you will also need to refer angular-ui.js in your application 由于AngularUI中存在ui.directives和ui.filters模块,因此您还需要在应用程序中引用angular-ui.js

<script src="http://cdnjs.cloudflare.com/ajax/libs/angular-ui/0.4.0/angular-ui.min.js"></script>

Your full code should look something like this 您的完整代码应如下所示

<html>
<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.8/angular.min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/angular-ui/0.4.0/angular-ui.min.js"></script>
</head>
<body ng-app="myApp" ng-controller="myCtrl">
    <p ng-repeat="x in persons | unique: 'age'">{{x.name}}</p>
<script>
//App declaration
var app = angular.module('myApp',['ui.directives','ui.filters']);
//Controller Declaration
app.controller('myCtrl',function($scope){
    $scope.persons = [{name: "Peter",age:23},{name:"Laila",age:25},{name:"Rosy",age:23}];
});
</script>
</body> 
</html> 

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM