标签: angularfire

AngularFire有时不会更新Firebase

下面的控制器使用表格和表格提供视图.该表的相关部分是:

<tr ng-repeat="obj in tab.col | filter:filterObj" ng-click="select(obj)" ng-class="isSelected(obj)">

如果单击一行,表单将显示obj的详细信息(其模型为tab.obj),您可以对其进行编辑.当用户修改表单字段中的obj时,表会适当地获取更新,但firebase不会获得任何更新,而是添加新对象(这是通过array.push(obj)完成的).

define(['app'], function(app) {
app.controller('LinksCtrl',['$scope', '$filter', '$http','angularFire','angularFireAuth', function($scope,$filter,$http, angularFire, angularFireAuth) {
$scope.links = {};
$scope.tabs = [];

var url = "https://<url>.firebaseio.com/links";
angularFireAuth.initialize(url, {scope: $scope, name: "user", path: "/"});
var promise = angularFire(url, $scope, 'links', {})

$scope.select = function (item) {
  for(i in $scope.tabs) {
    var tab = $scope.tabs[i];
    if (tab.active) {
      tab.obj = item;
      if (tab.obj.selected) {
        tab.obj.selected = ! tab.obj.selected;
      } else {
        tab.obj.selected = true;
        // $scope.$apply();
      }
    } …
Run Code Online (Sandbox Code Playgroud)

firebase angularjs-scope angularfire

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

AngularJS中跨域REST调用的正确架构模式是什么?

我创建了一个直接从客户端访问Salesforce REST API的AngularJS服务.但是,由于相同的原产地限制,我无法使其正常工作.即使访问非经过身份验证的REST服务并尝试$ http,$ http.json和Ajax.我也尝试了很多Json,Jsonp等的组合.

鉴于我有这么多问题,我认为我的一般方法是不正确的.也许我需要为此设置代理服务器?我的后端是Firebase,所以我目前没有自己的服务器.

我不相信Salesforce API支持COR,我无法改变它.

这是我尝试使用$ http和Ajax的一个例子.

return $http.jsonp('https://na1.salesforce.com/services/data/',{
headers: {
    'Content-type': 'application/json', 'Accept': 'application/json'
}}). 
                success(function (data, status, headers, config) {

                    callback(data);
                    console.debug(data.json);
                }).
                error(function (data, status, headers, config) {
                    console.debug("getVersions: failed to retrieve data: "+eval(data));
                });


$.ajax({
              url: 'https://na15.salesforce.com/services/data',
          type: "GET",
              dataType: "jsonp",
              beforeSend: function(xhrObj){
                                  xhrObj.setRequestHeader("Content-Type","application/json");
                                  xhrObj.setRequestHeader("Accept","application/json");
                                  xhrObj.setRequestHeader("X-Requested-With", "XMLHttpRequest");
                              },
              success: function (data) {
                  console.debug(data);
                  callback(data);
              },
              error: function(data) {

              }
          });
Run Code Online (Sandbox Code Playgroud)

salesforce angularjs angularfire

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

angularfireCollection:知道数据何时完全加载

我正在编写一个小的Angular Web应用程序,并且在加载数据时遇到了问题.我使用Firebase作为数据源,发现AngularFire项目听起来不错.但是,我无法控制数据的显示方式.

起初我尝试使用常规隐式同步:

angularFire(ref, $scope, 'items');
Run Code Online (Sandbox Code Playgroud)

它工作正常,当我在视图中使用模型$ items时显示所有数据.但是,当数据从Firebase数据源到达时,它的格式不会以视图支持的方式进行格式化,因此我需要在数据显示之前对数据进行一些额外的结构更改.问题是,我不知道数据何时完全加载.我尝试为$ items分配一个$ watch,但它被称为太早了.

所以,我继续前进并尝试使用angularfireCollection:

$scope.items = angularFireCollection(new Firebase(url), optionalCallbackOnInitialLoad);
Run Code Online (Sandbox Code Playgroud)

文档不是很清楚"optionalCallbackOnInitialLoad"的作用以及何时调用它,但是尝试访问$ items集合中的第一项将引发错误("Uncaught TypeError:无法读取未定义的属性'0'") .

我尝试添加一个按钮,在按钮的单击处理程序中,我记录了$ items中第一项的内容,并且它有效:

console.log($scope.items[0]);
Run Code Online (Sandbox Code Playgroud)

那是它!我的Firebase中的第一个对象显示没有任何错误...唯一的问题是我必须单击按钮才能到达那里.

那么,有没有人知道我怎么知道何时加载了所有数据然后将它分配给$ scope变量以显示在我的视图中?或者还有另一种方式吗?

我的控制器:

app.controller('MyController', ['$scope', 'angularFireCollection',
  function MyController($scope, angularFireCollection) {
    $scope.start = function()
    {
        var ref = new Firebase('https://url.firebaseio.com/days');
        console.log("start");

        console.log("before load?");

        $scope.items = angularFireCollection(ref, function()
        {
            console.log("loaded?");
            console.log($scope.items[0]); //undefined
        });  

        console.log("start() out");     
    };

    $scope.start();

    //wait for changes
    $scope.$watch('items', function() {
        console.log("items watch");
        console.log($scope.items[0]); //undefined
    });

    $scope.testData = function()
    { …
Run Code Online (Sandbox Code Playgroud)

angularjs firebase angularfire

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

写入Firebase时将Angular ng-model转换为整数

我正在使用AngularFire获取输入并将其保存到我的Firebase数据库.目前,我有一个输入用于输入服务的价格,如此(我使用输入类型的"文本"而不​​是"数字",因为我不希望它在旧浏览器中导致问题):

<p><input type="text" placeholder="Enter your monthly price here" ng-model="priceMonthly" required/></p>
Run Code Online (Sandbox Code Playgroud)

但是,当我在表单提交(使用更新函数)时将其写入我的Firebase时,它会将值写$scope.priceMonthly为字符串而不是整数.将此值写为整数而不是字符串的最佳方法是什么?

javascript angularjs firebase angularfire

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

Firebase:如何从存储特定密钥的数据中检索记录?

我在firebase中有数据如下所示:

"application": {
  "companies": {
    "firebase": {
      "creation": {
        "name": "Firebase Inc",
        "location": "USA"
      },

      "google": {
        "creattion": {
          "name": "Google Inc",
          "location": "USA"
        }
      }

      "facebook": {
      },

      "apple": {
      }
    }
  }
}
Run Code Online (Sandbox Code Playgroud)

companies密钥下有成千上万的记录.我如何有效地执行以下查询?

如何仅查询creation其名称下存在密钥的记录?

如何只查询creation名称下没有密钥的记录?

我还想调用.on('child_added')返回的结果集,以便稍后我只能处理那些特定的记录.可能吗?

javascript angularjs firebase angularfire

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

Angular 2 Firebase或AngularFire超出最大调用堆栈大小

尝试使用Firebase连接David Easts TODO Angular2演示时遇到错误。

超出最大呼叫堆栈大小

仓库可以在这里找到:https : //github.com/davideast/ng2do

我所做的不同之处是:导入绑定,AngularFire和FirebaseArray:

import {bind} from 'angular2/di';
import {AngularFire, FirebaseArray} from 'firebase/AngularFire';
Run Code Online (Sandbox Code Playgroud)

并注册componentServices:

@Component({
  selector: 'todo-app',
  componentServices: [
    AngularFire,
    bind(Firebase).toValue(new Firebase('https://webapi.firebaseio-demo.com/test'))
  ]
})
Run Code Online (Sandbox Code Playgroud)

这会导致错误:

最大调用堆栈大小超出错误。

firebase typescript angularfire angular

5
推荐指数
0
解决办法
1603
查看次数

升级到angularfire 1.2时,获取a.ref不是函数错误

以下代码库用于使用firebase 2.3.1和Angularfire 1.1.3

Var fb = new firebase("https://database name.firebaseio.com");

var fbObj = $firebaseObject(fb.child("users/" + userId));
Run Code Online (Sandbox Code Playgroud)

我升级到firebase3.0和Angularfire 1.2.

因此,以下是上述代码的修改方式:

var config = {/* ...  */};
firebase.initializeApp(config);
var fb = firebase.database().ref();

var fbObj = $firebaseObject(fb.child("users/" + userId))
Run Code Online (Sandbox Code Playgroud)

然而,上面的代码抛出了错误,例如a.ref在实例化fbObj时不是函数.

请建议.

firebase angularfire

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

注销后权限被拒绝

我用firebase数据库构建了一个AngularJs(1.6)应用程序.问题是:当用户退出时,我会收到大量错误permission_denied.

如果这可以有任何帮助:

firebase.auth().signOut().then(function() {
    $state.go('login');
}, function(error) {});
Run Code Online (Sandbox Code Playgroud)

有没有办法避免这种情况?

angularjs firebase angularfire firebase-authentication angularfire2

5
推荐指数
0
解决办法
637
查看次数

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

嗨,我是角度和firebase的新手,我从今天早上起就一直在努力解决一个简单的代码问题,我搜索了这个问题,但我找不到任何对我有用的解决方案(有时候我甚至都不懂它,我是一个真正的初学者)我在控制台上的错误如下:

未捕获错误:模块"AppModule"导入的意外值"AngularFireDatabase".请添加@NgModule注释.在位于eval(compiler.js:15225)的syntaxError(compiler.js:485)处,位于JitCompiler._compileModuleAndComponents的JitCompiler._loadModules(compiler.js:34255)的CompileMetadataResolver.getNgModuleMetadata(compiler.js:15200)的Array.forEach()处(compiler.js:34216)位于Eval(main.ts)的PlatformRef.bootstrapModule(core.js:5568)的CompilerImpl.compileModuleAsync(platform-b​​rowser-dynamic.js:230)上的JitCompiler.compileModuleAsync(compiler.js:34110) :11)

这是我的代码: app.module.ts

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';

import { AngularFireModule } from "angularfire2";
import { AngularFireDatabaseModule, AngularFireDatabase } from "angularfire2/database";
import { AppComponent } from './app.component';
import { environment } from '../environments/environment';


@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    AngularFireModule.initializeApp(environment.firebase),
    AngularFireDatabase    
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }
Run Code Online (Sandbox Code Playgroud)

app.component.ts

import { Component } from '@angular/core';

import { Observable } from 'rxjs/Observable';
import { AngularFireDatabase } …
Run Code Online (Sandbox Code Playgroud)

firebase typescript angularfire firebase-realtime-database angular

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

'AngularFireUploadTask'类型中不存在属性'downloadURL'

我的线路有问题

this.downloadURL = task.downloadURL()

使用AngularFireUploadTask,即使我导入它.

    import { Component, OnInit } from '@angular/core';
    import { AuthService } from '../../core/auth.service';
    import { AngularFireStorage, AngularFireStorageReference, AngularFireUploadTask } from 'angularfire2/storage';

    import { PostService } from '../post.service';
    import { Observable } from 'rxjs/Observable';



    @Component({
      selector: 'app-post-dashboard',
      templateUrl: './post-dashboard.component.html',
      styleUrls: ['./post-dashboard.component.css']
    })
    export class PostDashboardComponent implements OnInit {

      title: string;
      image: string = null;
      content: string;

      buttonText: string = "Create Post"

      uploadPercent: Observable<number>
      downloadURL: Observable<string>

      constructor(
        private auth: AuthService,
        private postService: PostService, 
        private storage: AngularFireStorage
      ) …
Run Code Online (Sandbox Code Playgroud)

typescript angularfire

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