Thinkster.io Angularjs教程第3章 - 连接到Firebase的问题

时间:2014-07-04 15:57:38

标签: javascript angularjs gruntjs firebase

我正在关注this教程,构建一个与firebase数据库连接的angularjs应用程序。我坚持第3章,我的应用程序应该使它初始连接到数据库。我有点觉得问题摆在我面前,因为我的命令提示符和jshint告诉我:

Running "jshint:all" (jshint) task

app\scripts\controllers\posts.js
  line 0   col 0  Bad option: 'app'.
  line 8   col 1  'app' is not defined.

app\scripts\services\post.js
  line 0   col 0  Bad option: 'app'.
  line 2   col 1  'app' is not defined.

6 problems

Warning: Task "jshint:all" failed. Use --force to continue.

Aborted due to warnings.

我的控制台给了我:

>Uncaught ReferenceError: app is not defined                      post.js
>Error: [$injector:unpr] Unknown provider: PostProvider <- Post
http://errors.angularjs.org/1.2.16/$injector/unpr?p0=PostProvider%20%3C-%20Post at http://localhost:9000/bower_components/angular/angular.js:78:12
at http://localhost:9000/bower_components/angular/angular.js:3705:19
at Object.getService [as get] (http://localhost:9000/bower_components/angular/angular.js:3832:39)
at http://localhost:9000/bower_components/angular/angular.js:3710:45
at getService (http://localhost:9000/bower_components/angular/angular.js:3832:39)
at invoke (http://localhost:9000/bower_components/angular/angular.js:3859:13)
at Object.instantiate (http://localhost:9000/bower_components/angular/angular.js:3880:23)
at http://localhost:9000/bower_components/angular/angular.js:7134:28
at link (http://localhost:9000/bower_components/angular-route/angular-route.js:913:26)
at nodeLinkFn (http://localhost:9000/bower_components/angular/angular.js:6579:13) <div ng-view="" class="ng-scope">

为什么我的其他js文件看不到我的'app'全局声明?

(apps.js)

var app = angular.module('angNewsApp', [
'ngAnimate',
'ngCookies',
'ngResource',
'ngRoute',
'ngSanitize',
'ngTouch'
])

(post.js)

'use strict';
app.factory('Post', function ($resource){
return $resource('https://sizzling-fire-1990.firebaseio.com/posts/:id.json');
});

**所有文件内容都是从教程中复制的

1 个答案:

答案 0 :(得分:8)

我在教程中遇到了同样的问题,而且这是因为你没有这样做,所以它说:

&#34;如果您查看您的grunt终端,您可以看到每次更改javascript文件时都会运行一个名为jshint的任务。这将检查您的javascript是否存在任何语法错误,并为您提供修复它们的提示。理想情况下,我们希望在我们的应用程序中没有错误。在.jshintrc中,我们可以添加&#34; app&#34;:false来告诉jshint有关应用的信息,以便我们可以在所有文件中使用它而不会发出任何警告,并且/ 全局应用:true /在app.js的顶部让jshint知道应用程序是在该文件中定义的。&#34;

就像app不是全局变量一样,你需要添加它,所以你的Jshintrc文件看起来像:

{

  "node": true,
  "browser": true,
  "esnext": true,
  "bitwise": true,
  "camelcase": true,
  "curly": true,
  "eqeqeq": true,
  "immed": true,
  "indent": 2,
  "latedef": true,
  "newcap": true,
  "noarg": true,
  "quotmark": "single",
  "regexp": true,
  "undef": true,
  "unused": true,
  "strict": true,
  "trailing": true,
  "smarttabs": true,
  "globals": {
    "angular": false,
    "app":false <---- Add this line
  }
}

和App.Js:

'use strict';
/* global app:true */ <---- Add this line


/**
 * @ngdoc overview
 * @name angNewsApp
 * @description
 * # angNewsApp
 * 
 * Main module of the application.
 * 
 */


var app = angular.module('angNewsApp', [
    'ngCookies',
    'ngResource',
    'ngRoute',
    'ngSanitize'
  ])....

同时在页面中添加<script src="scripts/services/post.js"></script>

我认为你的问题是。