标签: angularfire

以相反顺序打印列表或在第一个之前放置新项目

我从AngularJS和Firebase开始.我正在寻找在顶部的列表(托管在Firebase中)中插入新项目的方法,或者在顶部打印列表的最后一项.来自Angular的过滤器'orderBy'对我不起作用,因为它是一个列表.

我插入项目的实际代码:

var ref = new Firebase("https://[here is my instance].firebaseio.com/");
$scope.lineas = [];
angularFire(ref, $scope, "lineas");
$scope.agregarLinea = function() {
   $scope.lineas.push({texto: $scope.linea});
   $scope.linea = "";
};
Run Code Online (Sandbox Code Playgroud)

并列出项目:

<ul class='lineas'>
    <li ng-repeat="linea in lineas">
        <span>{{linea.texto}}</span>
    </li>
</ul>
Run Code Online (Sandbox Code Playgroud)

预先感谢您的帮助.

angularjs firebase angularfire

1
推荐指数
1
解决办法
2047
查看次数

JSON数据结构导致从数据库传递的数据最少

我试图了解如何使用JSON对象构建特定的数据集.

假设我有一堆用户,我就像这样存储在我的数据库中(我正在使用firebase):

 {
     0--{name:"Dog", details:{somestuffhere}}
     |
     1--{name:"Cat", details:{somestuffhere}}
     |
     2--{name:"Cow", details:{somestuffhere}}
    ...
 }
Run Code Online (Sandbox Code Playgroud)

使用firebase我可以使用/ 0/name查看Dog的名称条目

我理解它的方式,当我调用firebase(我正在使用angularjs)时,它将传输整个JSON对象.这适用于较小的数据集,但假设数据集增加到甚至5MB.初始负载是超慢的(在我看来),但事情可能不会太糟糕(虽然你只是挂在大量数据上玩).

我正在尝试构建一种构建数据的方法,所以如果我只想获取一个名单列表,那么我会根据名称(如果用户点击)来提取详细信息.

理想情况下,我会调用/ name,它将仅返回所有名称(不是与之关联的其余数据).

有没有人有什么建议?

编辑:我使用Dog Cat Cow作为例子,实际上他们是人,应用程序可以添加名称和详细信息(在其他页面上).我想首先看一个名字列表,然后点击它们作为链接,如果存在,如果名称不存在,我将创建它,然后允许添加"细节".我希望这会有所帮助.(我假设数据库将永远增长,这就是为什么我说5MB,实际上它可以增长到更多,但我不知道,这取决于使用情况)

json angularjs firebase angularfire

1
推荐指数
1
解决办法
541
查看次数

使用AngularFire v2获取关键值有点清晰?

对不起这个长度,但它让我有点疯狂:

假设我想在加载时获得项目的"标题"和".priority"键值.

首先让我们看看每件事的布局:

 $scope.items = $firebase(new Firebase("https://****.firebaseio.com"));

 $scope.items.$on('loaded', function() { 

console.log($scope.items);

});
Run Code Online (Sandbox Code Playgroud)

有了这个,我们得到:

> Object {$bind: function, $add: function, $save: function, $set: function, $remove: function…}
    > $add: function (item, cb) {
    > $bind: function (scope, name) {
    > $child: function (key) {
    > $getIndex: function () {
    > $on: function (type, callback) {
    > $remove: function (key) {
    > $save: function (key) {
    > $set: function (newValue) {

    > this is my item: Object
          $$hashKey: "012"
          $id: "this is my …
Run Code Online (Sandbox Code Playgroud)

firebase angularfire

1
推荐指数
1
解决办法
1万
查看次数

$ firebase()与大型数据对象上的新Firebase()的性能?

使用angularfire和大数据集,使用$ firebase()双向数据绑定对象和JS-API新Firebase()数据引用对象之间有什么样的性能差异?

firebase angularfire

1
推荐指数
1
解决办法
320
查看次数

使用Angular.js路由时出现404错误

我正在尝试使用angular和angularfire设置路由,但遇到了麻烦.

var app = angular.module('sampleApp', ['ngRoute', 'firebase', 'ui.bootstrap']);

app.config(function ($routeProvider) {
    $routeProvider
      .when('/', {
        templateUrl: 'index.html',
        controller: 'SampleCtrl'
      })
      .when('/login', {
        templateUrl: 'views/login.html',
        controller: 'LoginCtrl'
      })
      .otherwise({
        redirectTo: '/'
      });

  });

app.controller('LoginCtrl', function($scope, $firebase){
  console.log('LoginCtrl')
})
Run Code Online (Sandbox Code Playgroud)

当我尝试命中localhost:8000/login时收到以下错误消息

Error code explanation: 404 = Nothing matches the given URI.
Run Code Online (Sandbox Code Playgroud)

如何使用ngRoute和AngularFire设置简单路线?

javascript html5 angularjs firebase angularfire

1
推荐指数
1
解决办法
1197
查看次数

angularfire:使用$ asArray()从我的工厂获取Firebase数组时遇到问题

我有一个从Firebase获取数据的工厂,我希望我的控制器能够访问它.但是,当我在我的控制器中调试数据时,它不是我期望它的数组[10],而是添加了键0,1,2,... 10,$$的数组, $$错误,$$移动,......等等.但是,当我跳过使用工厂,并在我的firebase ref中直接在我的控制器中使用$ asArray()方法时,它很好地显示为数组[10]

在我的工厂,这就是它的样子......

var listingsref = new Firebase("https://something.firebaseio.com");
var sync2 = $firebase(listingsref);
var products = sync2.$asArray();
factory.getProducts = function(){
    return products;
};
Run Code Online (Sandbox Code Playgroud)

调节器

$scope.products = marketFactory.getProducts();
Run Code Online (Sandbox Code Playgroud)

我的控制器中的console.log($ scope.products)应该是Array [10],但它是一个带有数据的数组+更多的$$方法.有谁知道发生了什么?谢谢

编辑:完整的工厂文件

(function(){
var marketFactory = function($firebase){
    var listingsref = new Firebase("https://something.firebaseio.com");
    var sync2 = $firebase(listingsref);
    var products = sync2.$asArray();

    var factory = {};
    factory.getProducts = function(){
        console.log(products);
        return products;
    };

    factory.getProduct = function(productId){
        for(var x = 0; x<products.length ;x++){
            if(productId == products[x].id){
                return {
                    product:products[x],
                    dataPlace:x
                };
            } …
Run Code Online (Sandbox Code Playgroud)

arrays angularjs firebase angularfire

1
推荐指数
1
解决办法
2909
查看次数

当我调用它时,不会触发$ rootScope.$ on()方法.为什么?

我正在尝试使用Angularjs进行简单的登录功能.我已经分离了控制器并提供了一项服务,通过Firebase服务器对用户进行身份验证.我应该提到的另一件事是我正在使用他们的名为Angular Fire的API.问题是我试图在函数上触发$ rootScope.$.这是代码:

myApp.controller('StatusController', function($scope, $rootScope, $firebase, $firebaseAuth) {

    console.log($rootScope);

    $rootScope.$on('$firebaseAuth:authWithPassword', function(e, authUser){
        console.log("printsomething");
        $scope.userEmail = authUser.userEmail;
    }); //$firebaseAuth:login
});//StatusController
Run Code Online (Sandbox Code Playgroud)

这是身份验证服务:

myApp.factory('Authentication', function ($firebase, $firebaseAuth, FIREBASE_URL, $location) {

    var ref = new Firebase(FIREBASE_URL);
    console.log(FIREBASE_URL);
    var simpleLogin = $firebaseAuth(ref);

    var myObject = {
        login: function (user) {
            return **simpleLogin.$authWithPassword**({
                email: user.email,
                password: user.password
            });
        } //login
    } //myObject
    return myObject;
})
Run Code Online (Sandbox Code Playgroud)

以下是调用身份验证的位置.在我的注册控制器中:

myApp.controller('RegistrationController', function($scope, $firebaseAuth, $location, Authentication) {


$scope.login = function() {
    Authentication.login($scope.user)
    .then(function(user) {
        $location.path('/meetings');
    }, function(error) {
        $scope.message = …
Run Code Online (Sandbox Code Playgroud)

javascript angularjs firebase angularjs-scope angularfire

1
推荐指数
1
解决办法
2413
查看次数

使用$ add angularfire生成自定义键

当我使用该$add函数添加新记录时,如何在angularfire中的数组中生成自定义键.只需看看下面的源代码中的注释.这是我的代码,但仍然得到firebase生成的随机密钥.

register : function(user){
  return simpleLogin.$createUser({
    email: user.email,
    password: user.password
  }).then(function(regUser){
    //console.dir(regUser);
    var ref = new Firebase(FIREBASE_URL + 'users');
    var firebaseUsers = $firebaseArray(ref);
    var userInfo = {
      date: Firebase.ServerValue.TIMESTAMP,
      regUser: regUser.uid,
      firstname: user.firstname,
      lastname: user.lastname,
      email: user.email
    }

    //this is when i want to generate the key
    firebaseUsers.$add(userInfo).then(function(ref) {

    });
  });
},//register
Run Code Online (Sandbox Code Playgroud)

仍然使用$ add函数获得随机密钥

javascript firebase angularfire

1
推荐指数
1
解决办法
2763
查看次数

如何从angularfire2创建GeoPoint?

我正在尝试创建新的GeoPoint使用方法,AngularFirestore但我不断收到错误消息,指出该方法不可用。如何在不导入整个firebasenpm模块的情况下执行此操作AngularFire

    import { Component, OnInit } from "@angular/core";
    import {AngularFirestore, AngularFirestoreCollection} from "angularfire2/firestore";
    @Component({
      selector: "app-firebase-menu-bar",
      templateUrl: "./firebase-menu-bar.component.html",
      styleUrls: ["./firebase-menu-bar.component.css"]
    })
    export class FirebaseMenuBarComponent {
      private itemsCollection: AngularFirestoreCollection<any>;
      private AngularFirestoreCollection;
      private draftCollection;
      private productionCollection;
      constructor(private db: AngularFirestore) {
        // this.production = db.collection('/production').snapshotChanges();
        this.db.firestore.GeoPoint(40, 100);
      }
    }
Run Code Online (Sandbox Code Playgroud)

firebase angularfire angular google-cloud-firestore

1
推荐指数
1
解决办法
1925
查看次数

错误:意外值'AngularFireAuth'.由'AppModule'模块导入

我在ionic3应用程序上遇到以下错误

未捕获错误:模块"AppModule"导入的意外值"AngularFireAuth".请添加@NgModule注释.

这是我的app.module.ts:

  import { BrowserModule } from '@angular/platform-browser';
    import { ErrorHandler, NgModule } from '@angular/core';
    import { IonicApp, IonicErrorHandler, IonicModule } from 'ionic-angular';

    import { MyApp } from './app.component';
    import { HomePage } from '../pages/home/home';
    import { ListPage } from '../pages/list/list';
    import { LoginPage } from '../pages/login/login';

    import { StatusBar } from '@ionic-native/status-bar';
    import { SplashScreen } from '@ionic-native/splash-screen';

    import { HttpModule } from '@angular/http';
    import { Geolocation } from '@ionic-native/geolocation';
    import { AngularFireDatabaseModule, AngularFireDatabase } from 
    'angularfire2/database';
    import …
Run Code Online (Sandbox Code Playgroud)

firebase angularfire ionic3 angular

1
推荐指数
1
解决办法
3409
查看次数