【问题标题】:Restify server with Angular, not working使用 Angular 重新验证服务器,无法正常工作
【发布时间】:2014-08-26 15:27:09
【问题描述】:

我正在学习使用 Restify 构建一个 Restful API 并使用 Angular。

下面是我的结构:

Project
  page_admin        
    core.js 
    index.html
  node_modules
    restify
    mongojs
  server.js

我已经设置了服务器并实现了几个 API 调用。

以下新闻 API 在浏览器中返回 JSON 数据列表:

`http://localhost:8080/news`

`[{"_id":"53b2a2c3373551813dfe8b91","title":"first","subtitle":"foobar","textbody":"","postedOn":"2014-07-01T12:00:03.215Z"},{"_id":"53b2a122373551813dfe8b8e","title":"my second","subtitle":"my second title","textbody":"node is cool","postedOn":"2014-07-01T11:53:06.389Z"},{"_id":"53b2a0cd373551813dfe8b8d","title":"delay announcement","subtitle":"sub ","textbody":"I am the text body","postedOn":"2014-07-01T11:51:41.678Z"}]`

这是我处理客户端路由的代码:

server.get('/', restify.serveStatic({

    'directory': './page_admin',
    'default': 'index.html'
}));

我的 index.html 很简单:

<!-- index.html -->
<!doctype html>

<!-- ASSIGN OUR ANGULAR MODULE -->
<html ng-app="bluesky">
<head>
    <!-- META -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1"><!-- Optimize mobile viewport -->

    <title>My test app</title>

    <!-- SCROLLS -->
    <link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css"><!-- load bootstrap -->
    <style>
        html                    { overflow-y:scroll; }
        body                    { padding-top:50px; }
        #todo-list              { margin-bottom:30px; }
    </style>

    <!-- SPELLS -->
    <script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script><!-- load jquery -->
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.0.8/angular.min.js"></script><!-- load angular -->
    <script src="core.js"></script>

</head>
<!-- SET THE CONTROLLER AND GET ALL TODOS -->
<body ng-controller="mainController">
    <div class="container">

        <!-- HEADER AND TODO COUNT -->
        <div class="jumbotron text-center">
            <h1>My example is working <span class="label label-info">{{ news.length }}</span></h1>
        </div>

        <!-- TODO LIST -->
        <div id="todo-list" class="row">
            <div class="col-sm-4 col-sm-offset-4">

                <!-- LOOP OVER THE TODOS IN $scope.todos -->
                <div class="checkbox" ng-repeat="new in news">
                    <label>
                        <input type="checkbox" ng-click="deleteTodo(new._id)"> {{ new.subtitle }}
                    </label>
                </div>

            </div>
        </div>


    </div>

</body>
</html>

core.js 是这样的:

    var bluesky = angular.module('bluesky', []);

    function mainController($scope, $http) {

    $scope.formData = {};

    $http.get('/news')
        .success(function(data) {

            $scope.news = data;
            console.log(data);
        })
        .error(function(data) {
            console.log('Error: ' + data);

        });
    }

当我尝试导航到:http://localhost:8080

我得到了我的索引页,但它显示了我:

'My example is working {{ news.length }} 

在控制台中,我看到以下错误:

    GET `http://localhost:8080/core.js` 404 (Not Found) 
    localhost/:24

    Uncaught Error: No module: bluesky 
    angular.min.js:18

我刚刚错过了什么,所以角度没有检索数据?

================================================ ===============

更新

如果我直接将core.js放在里面,那就可以了。

但是,如何解决这个 404 not found 问题?只是不想在索引页面中包含所有的js文件。

【问题讨论】:

  • 您的索引文件中指定的 core.js 的位置似乎不正确。仔细检查路径。
  • 正如它所说,它找不到你的 core.js 文件
  • page_admin 文件夹里的文件 ryt
  • 嗨 Sam,试过了,但还是不行

标签: javascript json node.js angularjs restify


【解决方案1】:

据我对 Angular js 的了解,您的模块中没有定义控制器。所以不要使用function mainController($scope, $http) { .... }

你应该在模块 bluesky 中定义控制器如下

bluesky.controller("mainController",function($scope,$http) { .... });

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2015-03-06
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2020-04-24
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多