Код Angular не работает с express

#javascript #html #angularjs #express

#javascript #HTML #angularjs #экспресс

Вопрос:

У меня проблема с angular. Мой код angular отлично работает, когда я запускаю его один, но не работает, когда я обращаюсь к нему на localhost с помощью express. Что происходит, так это то, что он отображает только HTML-файл. мой серверный код : *

 var express = require('express'),
    app     = express();
app.get('/', function(req, res) {
    res.sendfile('./app/client/main.html');
});
app.listen(3000, function() {
    console.log('I'm listening...');
})

мой код контроллера angular является

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

app.controller('mainController', function($scope){

     $scope.posts = [];
     $scope.newPost = {created_by: '', text: '', create_at: ''};

      $scope.post = function(){
        $scope.newPost.created_at = Date.now();
        $scope.posts.push($scope.newPost);
        $scope.newPost = {created_by: '', text: '', created_at: ''};
  };
});

и ангуляризованный HTML-код является

 <!--main.html-->
<!doctype html>
<html>
  <head>
    <title>Tiks</title>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.0/angular.min.js"></script>
    <script src="javascripts/tiks.js"></script>
  </head>
  <body ng-app="tiks">
    <div id='main' ng-controller="mainController">
     <form ng-Submit="post()">
        <input required type="text" placeholder="Your name" ng-model="newPost.created_by" /> 
        <textarea required maxlength="200" rows="3" placeholder="Say something" ng-model="newPost.text"></textarea>
        <input class="button" type="submit" value="Chirp!" />
      </form>
      <div id="post-stream">
        <h4>Tiks Feed</h4>
              <div class='post' ng-repeat="post in posts | orderBy:'created_at':true" ng-class-odd="'odd'" ng-class-even="'even'">
            <p>{{post.created_by}} says {{post.text}} at {{post.created_at}}</p>
            </div>
        </div>
      </div>
    </div>
  </body>
</html>

пожалуйста, помогите

Ответ №1:

Ваш HTML запрашивает запрос javascripts/tiks.js в script теге, но на вашем сервере нет маршрута, настроенного для его обслуживания.

Попробуйте проверить выполняемые запросы, например, с помощью сетевой вкладки инструментов разработчика Google Chrome, и вы, вероятно, увидите 404 ошибку при запросе .js файла.

Вы должны использовать express.static для обслуживания файлов из папки вместо того, чтобы определять конкретные ресурсы по отдельности, как вы делаете для ./app/client/main.html .

 app.use('/', express.static(__dirname   '/app/client/'));

тогда вам пришлось бы получить доступ http://localhost/main.html , чтобы получить к нему доступ.

1. Вы должны предложить, как это исправить, то есть использовать промежуточное программное обеспечение для обработки статических файлов expressjs.com/en/starter/static-files.html

2. 10x за ваш ответ, как мне добавить маршрут?

3. хммм, хорошо, я отредактировал с помощью / параметра, чтобы сделать его более понятным

4. я добавил app.use(express.static(‘./app / client / javascripts’)); в свой код на сервере, но безуспешно

5. Вы поступили с / параметром так, как это происходит сейчас? (Я отредактировал ответ)