AngularFire - 如何使用 ng-repeat 为子模板定义项目 ID? [英] AngularFire - How to define item ID for child template with ng-repeat?

问题描述

也许我的问题似乎很容易解决，但我已经有好几个小时了:当我在仪表板中时，我的 Firebase 数据库的所有数据都是可见的(使用 Ng-repeat).但是我找不到选择一个特定项目并在另一个页面中查看他的详细信息的解决方案.

我已经在 HTML 中测试了这个方法(这是一个例子):

<div class="card" ng-href="#/post/">"><h1>{{post.title}}</h1><p>{{post.content}}</p>

在应用 JS 中:

 .state('tabpost', {网址:'标签/ID'，templateUrl: 'templates/tab-post.html',控制器:'PostCtrl'})

In Service JS(在 Post Factory 中):

 myApp.factory("Post", ["$firebaseArray", "$firebaseObject", function($firebaseArray, $firebaseObject) {var postRef = new Firebase('https://myApp.firebaseio.com/Posts/');var userRef = new Firebase('https://myApp.firebaseio.com/Users/');var 帖子 = $firebaseArray(postRef);变量后 = {所有:帖子，得到:函数(postKey){var postId = $firebaseObject(postRef);返回 $firebaseObject(eventRef.child('Posts').child(postId).child(userid));},添加:功能(帖子){var postId = $firebaseArray(postRef, userRef);event.userid = userRef.getAuth();返回 postId.$add(post);}}回邮；}]);

我的帖子控制:

myApp.controller('PostCtrl', ['$ionicFrostedDelegate', '$ionicScrollDelegate','$state','$scope', 'Post', 'Auth', '$firebaseObject', '$firebaseArray', function($ionicFrostedDelegate, $ionicScrollDelegate, $state,$scope, Post, Auth, $firebaseObject, $firebaseArray) {var PostRef = new Firebase("https://myApp.firebaseio.com/Posts");$scope.posts = Post.all;$scope.post = {'title': '', 'content': ''};$scope.auth = Auth;

PS:尝试一堆已经过时的教程花了16个小时，我相信解决方案不会那么简单.

我昨天和今天早上已经发布了两个类似的问题，但每个提议的解决方案都没有奏效.我将非常感谢帮助我摆脱这种僵局的人.

我在使用 jsFiddle 时仍然有点问题，我承诺一旦我解决了这个问题，我就会学会使用它.

谢谢你给我时间

解决方案

您可以使用路由提供程序来做到这一点.我在我的应用程序中使用了它，效果很好.

myApp.config( ['$routeProvider', function($routeProvider){$routeProvider.当('标签'，{templateUrl: 'tabpost/id',控制器:'PostCtrl'});}]);

Maybe my issue seems easy to resolve, but I've this problem since a lot of hours : When I'm in my dashboard, all data of my Firebase database are visible (With Ng-repeat). But I can't found a solution for choose one specific item and see his details in another page.

I've test this method in HTML (This is an example) :

<div ng-repeat="post in posts">

<div class="card" ng-href="#/post/">">
<h1>{{post.title}}</h1>
<p>{{post.content}}</p>
</div>

</div>

In App JS :

  .state('tabpost', {
  url: 'tabpost/id',
  templateUrl: 'templates/tab-post.html',
  controller: 'PostCtrl'
  })

In Service JS (in Post Factory) :

 myApp.factory("Post", ["$firebaseArray", "$firebaseObject", function($firebaseArray, $firebaseObject) {
var postRef = new Firebase('https://myApp.firebaseio.com/Posts/');
var userRef = new Firebase('https://myApp.firebaseio.com/Users/');
var posts = $firebaseArray(postRef);

     var Post = {

         all: posts,

         get: function (postKey){
          var postId = $firebaseObject(postRef);
                return $firebaseObject(eventRef.child('Posts').child(postId).child(userid));

              }
            ,
        add: function (post){
          var postId = $firebaseArray(postRef, userRef);
          event.userid = userRef.getAuth();
                return postId.$add(post);
              }
       }
       return Post;

}]);

My PostCtrl :

myApp.controller('PostCtrl', ['$ionicFrostedDelegate', '$ionicScrollDelegate','$state','$scope', 'Post', 'Auth', '$firebaseObject', '$firebaseArray', function($ionicFrostedDelegate, $ionicScrollDelegate, $state,$scope, Post, Auth, $firebaseObject, $firebaseArray) {

  var PostRef = new Firebase("https://myApp.firebaseio.com/Posts");

  $scope.posts = Post.all;

  $scope.post = {'title': '', 'content': ''};

  $scope.auth = Auth;

PS : It took 16 hours to try a bunch of tutorials mostly obsolete , and I am sure that the solution can not be that simple.

I already posted two similar issues yesterday and this morning but each of the proposed solutions have not worked . I would be immensely grateful to the person who would help me out of this impasse .

I still have a little trouble with jsFiddle promised I would learn to use it once I would have solved this problem.

Thank you for giving me time

解决方案

you can use route provider to do that. I used that for my application and it works great.

myApp.config( ['$routeProvider', function($routeProvider){
    $routeProvider.
        when('tabpost', {
            templateUrl: 'tabpost/id', 
            controller: 'PostCtrl' 
        });
}]);

这篇关于AngularFire - 如何使用 ng-repeat 为子模板定义项目 ID?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！