2016-07-21 32 views
0

现在我有一张表,当前显示所有条目形成firebase中的“events”节点。Firebase/Angular JS只显示由登录用户创建的Firebase条目

但是,我只想显示登录用户创建的事件。他们现在正在显示所有用户创建的事件。

我猜我可能能够在标签中的ng-repeat后面使用ng-if指令,但是,我不确定应该放入什么内容。

这是我的表:

<table class="table table-striped"> 
<thead> 
    <tr> 
    <th>Title</th><th>Location</th> <th>Actions</th> 
    </tr> 
</thead> 
<tbody> 
    <tr scope="row" ng-repeat="event in events | reverse" > 
    <td>{{event.title}}</td> 
    <td>{{event.location}}</td> 
    <td><button class="btn btn-primary" ng-click="events.$remove(event)"><span class="glyphicon glyphicon-trash" aria-hidden="true"></span></button></td> 
    </tr> 

</tbody> 

用户对象看起来像这样:

{ 
"provider": "password", 
"uid": "635gt3t5-56fe-400d-b50b-1a6736f8874a", 
"token": 
"eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJlbWFpbCI6Im1pY2hhZWwubGFyaXZpZXJlMTk3M0BnbWFpbC5jb20iLCJlbWFpbF92ZXJpZmllZCI6ZmFsc2UsImlhdCI6MTQ2OTEyNTYyOSwidiI6MCwiZCI6eyJwcm92aWRlciI6InBhc3N3b3JkIiwidWlkIjoiNmY5ZmM0NTUtNTZmZS00MDBkLWI1MGItMWE2NzM2Zjg4NzRhIn19.yIzzV7Or7tUlXi-sSWeioNx6LLoQ0U9qnW1X06rpSmA", 
"password": { 
"email": "[email protected]", 
"isTemporaryPassword": false, 
"profileImageURL": "https://secure.gravatar.com/avatar/5f9effbf8cbea69792c595079cf25d38?d=retro" 
}, 
"auth": { 
"provider": "password", 
"uid": "635gt3t5-56fe-400d-b50b-1a6736f8874a", 
"token": { 
    "email_verified": false, 
    "email": "[email protected]", 
    "exp": 1469212029, 
    "iat": 1469125629, 
    "sub": "635gt3t5-56fe-400d-b50b-1a6736f8874a", 
    "auth_time": 1469125629, 
    "firebase": { 
    "identities": { 
     "email": [ 
     "[email protected]" 
     ] 
    } 
    } 
} 
}, 
"expires": 1469212029 
} 

我的控制器看起来是这样的:

angular.module('myApp').controller('ChatCtrl', function($scope, user, 
Ref, $firebaseArray, $timeout) { 

console.dir('user: ' + JSON.stringify(user)); 

// synchronize a read-only, synchronized array of events, limit to most recent 10 
$scope.events = $firebaseArray(Ref.child('events').limitToLast(10)); 
// display any errors 
$scope.events.$loaded().catch(alert); 

// provide a method for adding a event 
$scope.addEvent = function(newEvent) { 


    if (newEvent) { 
     // push a event to the end of the array 
     $scope.events.$add({ 
     title:  newEvent.title, 
     location: newEvent.location, 
     createdBy: user.uid, 
     createdAt: Firebase.ServerValue.TIMESTAMP 
     }) 
     // display any errors 
      .catch(alert); 
    } 

    }; 

function alert(msg) { 
    $scope.err = msg; 
    $timeout(function() { 
     $scope.err = null; 
     }, 5000); 
    } 
}); 

这是什么用户和事件看起来像火力点:

enter image description here

回答

1

为了得到你要寻找的结果,尝试使用angularjs过滤器。

在您控制器添加一个函数调用

$scope.filterByUID = function(event) { 
    if (event.createdBy === user.uid) { 
     return true; 
    } 
    return false; 
} 

此功能将作为一个过滤器,只让我们通过由事件的createdBy比较用户的UID当前用户创建的事件采取行动。

然后在你的HTML

<tr scope="row" ng-repeat="event in events | reverse" > 

改变这一行要

<tr scope="row" ng-repeat="event in events | reverse | filter:filterByUID" > 

这就告诉你希望你的项目与我们在控制器中定义的过滤器过滤angularjs。

编辑:下面是使用自定义过滤器的引用:我试图把该功能在我的控制器AngularJS : Custom filters and ng-repeat

+0

,但功能似乎并没有被获取调用。我添加了一个console.log();在if语句内,并且在它的声明之外,在函数内,并且控制台中不显示任何内容。 'var filterByUID = function(event){if(event.createdBy === user.uid){ console.log(“if condition met”); 返回true; } console.log(“if condition not met”); 返回false; };'无论哪个用户创建它们,所有事件都会显示出来。 – Livi17

+0

我得到它的工作使用:'$ scope.filterByUID =功能(事件){...' – Livi17

+1

对不起。我完全忘记了将函数设置为$ scope的属性。我编辑了答案,我很高兴解决了这个问题。 – Davis