Photoshop Question posted in
The official user guide can be found here.

Angular filter not working filter not show category value – Photoshop

I am adding filter to show category but my setCurrentCategory function not show any value show undefined. I want to show category for every person. i use ng-click and pass the my function than i use filter and pass the value.

var myapp = angular.module("myapp", []);
myapp.controller("myCtrl", function($scope){

$scope.categories = [

{'id' : 0, 'Name' : 'Manu'},
{'id' : 1, 'Name' : 'Rajveer'},
{'id' : 2, 'Name' : 'Heament'},
{'id' : 3, 'Name' : 'Yogesh'},
{'id' : 5, 'Name' : 'Sajid'},


];

$scope.languages = [
{'id' : 0, 'title' : 'Angular', 'url' : 'http://angularjs.org', "category": "Manu"},
{'id' : 0, 'title' : 'Html5', 'url' : 'http://www.html5rocks.com/en/', "category": "Manu"},
{'id' : 0, 'title' : 'BootStrap', 'url' : 'http://getbootstrap.com/', "category": "Rajveer"},
{'id' : 0, 'title' : 'Css', 'url' : 'http://www.tutorialspoint.com/css/', "category": "Yogesh"},
{'id' : 0, 'title' : 'emberjs', 'url' : 'http://emberjs.com/', "category": "Heament"},
{'id' : 0, 'title' : 'Javascript', 'url' : 'https://www.javascript.com/', "category": "Rajveer"},
{'id' : 0, 'title' : 'jQuery', 'url' : 'https://jquery.com/', "category": "Yogesh"},
{'id' : 0, 'title' : 'Photoshop', 'url' : 'http://www.photoshop.com/', "category": "Sajid"},
{'id' : 0, 'title' : 'Coral Draw', 'url' : 'http://www.coreldraw.com/in/', "category": "Heament"},
{'id' : 0, 'title' : 'Flash', 'url' : 'https://get.adobe.com/flashplayer/', "category": "Sajid"},

];

$scope.currentCategory = null;

function setCurrentCategory(category){

	$scope.currentCategory = category;
}

function isCurrentCategory(category){

	return $scope.currentCategory !== null && category.name === $scope.currentCategory.name;
}

$scope.setCurrentCategory = setCurrentCategory;
$scope.isCurrentCategory = isCurrentCategory;

});
.left_box{background-color: #909090; padding: 0px;}
.right_box{padding-top: 25px;}
.nav__box{

  padding-top: 25px;
}
.nav__box ul{ padding: 0px; margin: 0px; }
.nav__box ul li {list-style: none; padding: 10px; text-align: center;}
.nav__box ul li a{
font-size: 16px;
color: black;
text-decoration: none;


}
.nav__box ul li a:hover{background: }
.language_list { padding: 0px; margin: 0px; }

.language_list li{list-style: none; padding: 5px 10px; margin-bottom: 2px; border: solid 1px #ededed} 
.language_list li a {text-decoration: none; padding-left: 15px}
.remove{float: right; font-size: 12px; color: red; line-height: 16px;}
.edit{font-size: 12px; color: red; line-height: 16px; }
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myapp" class="container-fluid" ng-controller="myCtrl">
	<div class="row">
		<article class="col-md-1 left_box">
		<a href="" ng-click="setCurrentCategory(null)"><img  src="images/logo.png" alt="AngularJs"/></a>

		<nav class="nav__box">
			<ul>
			<li ng-repeat='categorie in categories'>
			<a href="#" ng-click="setCurrentCategory(category)">{{categorie.Name}}</a>
			</li>
				
			</ul>

		</nav>

		</article>
		<article class="col-md-11 right_box">
			
		<ul class="language_list">
			<li ng-repeat= "language in languages | filter:{category:currentCategory.Name}">
			<span>Edit</span>
			<a href='{{language.url}}' target="_blank">{{language.title}}</a>
			<span class="remove">Close</span>
			</li>

		</ul>


		</article>

	</div>

</div>
Tags:

3

Answers


  1. 0

    Make sure you’re passing the category object:

    <li ng-repeat='category in categories'> // changed to 'category'
            <a href="#" ng-click="setCurrentCategory(category)">{{category.Name}}</a>
            </li>
    Login or Signup to reply.
  2. 0 
    <ul>
<li ng-repeat='categorie in categories'>
<a href="#" ng-click="setCurrentCategory(category)">{{categorie.Name}} </a>                   
</li>           
</ul>

    i u need to pass categorie 

    <ul>
<li ng-repeat='categorie in categories'>
<a href="#" ng-click="setCurrentCategory(categorie )">{{categorie.Name}}</a>                      
</li>           
</ul>
    Login or Signup to reply.
  3. 0

    In your code you must use the same reference used in ng-repeat to pass to the Setcurrentcategory function. They must match. 

    <li ng-repeat='category in categories'> 
        <a href="#" ng-click="setCurrentCategory(category)">{{category.Name}}</a>
        </li>
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search