CODEWITHSUNDEEP
angularjs
user2221845
user2221845

Reputation: 63

Angularjs Filter to pass data from one table to another table (using a checkbox)

I am trying to populate a table with data being provided by another table.
Table One has all of the data with a Checkbox for each item.
Table Two should contain only those items that have been checked in Table One.

I can see that the 'Checked' value gets Set to true, but does not work (I get all data, all the time in Table Two).
$scope.data
Object {key: "3", value: "c", $$hashKey: "006", checked: true}

JSFiddle

Desired Result:

Desired Result

<span>Table One</span>
<div ng-controller="checkBoxCtrl">
<table width="400" border="1">
    <tr ng-repeat="data in tableOne" id="item{{data.key}}">
        <td width="20px">
            <input type="checkbox" ng-model="data.checked">
        </td>
        <td>{{data.key}}</td>
        <td>{{data.value}}</td>
    </tr>
</table>

<br>
<span>Table Two</span>
<table width="400" border="1">
        <tr ng-repeat="data in tableOne | filter: data.checked==true">
            <td>{{data.key}}</td>
            <td>{{data.value}}</td>
        </tr>

</table>


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

    function checkBoxCtrl($scope){
        $scope.tableOne=[
                        {key: '1',  value: 'a'},
                        {key: '2',  value: 'b'},
                        {key: '3',  value: 'c'},
                        {key: '4',  value: 'd'}
                        ];  
        };

Upvotes: 0

Views: 1785

Answers (2)

Darryl
Darryl

Reputation: 1451

simply remove one of the equal signs.

<tr ng-repeat="data in tableOne | filter: checked=true">

Upvotes: 1

charlietfl
charlietfl

Reputation: 171669

Here's the syntax to filter a property....basically it's an object but I guess in angular terms it might be considered an expression. I'm not 100% sure how to define it in words...but it works

<tr ng-repeat="data in tableOne | filter: {checked:true}">

DEMO

Upvotes: 0

Related Questions