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

Question

我正在关注 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”全局声明？

(应用程序.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');
});

**所有文件内容均复制自教程

Answer 1

我在做教程时遇到了同样的问题，这是因为你没有这样做，步骤说:

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

像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>在页面中。

我认为你的问题在于此。