私はappを実行するとjsファイルからコンテンツを取得できません。誰かが助けてくれればより良いでしょう

-1

私はアプリを実行するとjsファイルを取得できません。私はappを実行するとjsファイルからコンテンツを取得できません。誰かが助けてくれればより良いでしょう

index。 HTML

<!DOCTYPE html> 
<html ng-app="movieApp"> 
    <head> 
     <title> Movies I like..</title> 
     <base href="/"> 
    </head> 
    <script src="node_modules/angular/angular.js"></script> 
    <script src="node_modules/angular-ui-router/release/angular-ui-router.js"></script> 
    <body> 
     <div style="text-align: center;"> 
      <a ui-sref="movies">Movies</a> 
     </div> 

     <div ui-view></div> 
    </body> 
    <script src="js/app.js"></script> 
    <script src="js/movies.js"></script> 
</html>

app.js

var movieApp = angular.module('movieApp', ['ui.router']); 

movieApp.config(function($stateProvider, $urlRouterProvider, $locationProvider) { 
    $urlRouterProvider.otherwise('movies'); 
    $stateProvider 
    .state('movies', { 
     'url' : '/movies', 
     templateUrl : '/views/movies.html' 
    }); 
    $locationProvider.html5Mode(true); 
});

movies.html

<div> 
     <input type="text" ng-model="movie" placeholder="Enter the Movie Name.."> 
     <button ng-click="createMovie()" 
     ng-show="isEditting">Create Movie</button> 
     <button ng-click="updateTask(movie, 'save')" 
     ng-show="!isEditting">Save Movie</button> 
     <br> 
     <br> 
     <div ng-show="movies.length > 0"> 
      <table border="1px solid" style="border-collapse: collapse;margin-bottom: 30px;"> 
       <tr><th>Movies</th><th>Edit</th><th>Delete</th></tr> 
       <tr ng-repeat="movie in movies"> 
        <td>{{movie.movieName}}</td> 
        <td><button ng-click="edit(movie)">Edit</button></td> 
        <td><button ng-click="delete(movie)">Delete</button></td> 
       </tr> 
      </table> 
     </div> 
    </div> 
</div>

movies.jsは、誰もがplsは私が間違いをした場所を見つけるには少し厳しいですので、私はこのproblem.Amに初心者を解決するために助けることができる

for some reference i had attached the image of the folders

var app= angular.module('movieApp'); 

app.controller('Moviecntrl',function($scope) { 
    $scope.movies=[ 
    {movieName: 'DDLJ'}, 
    {movieName: 'Jack Reacher'}, 
    {movieName: 'Mission Impossible'} 
]; 
});

を提出します。

出典

2017-09-18 pavi k

は、お使いのベースhをチェック置きますrefパス。私はあなたのコードのコピーをplknrで作成します。私はbaseとhtml5モードを削除します。あなたのjsと作品のパスを再配置します。 –

私は

server.jsあなたはそれがあなたのファイルが置かれているパスと一致する定義ベースHREFパスの

var express = require("express"); 
 
var path=require('path') 
 
var app = express(); 
 
var PORT = process.env.PORT || 3000; 
 
app.use(express.static(path.join(__dirname + '/../client'))); 
 
app.listen(PORT, function() { 
 
\t // body... 
 
\t console.log("We are connected to PORT-",PORT); 
 
});

チェックサーバ側でノードのJSを使用し、私は削除baseとhtml5モードをfalseに設定すると、相対パスが機能します。私はexample

index.htmlを

<!DOCTYPE html> 
<html ng-app="movieApp"> 
    <head> 
     <title> Movies I like..</title> 

     <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.5/angular.js"></script> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.4.2/angular-ui-router.js"></script> 
    <script src="app.js"></script> 
    <script src="movies.js"></script> 
    </head> 

    <body> 
     <div style="text-align: center;"> 
      <a ui-sref="movies">Movies</a> 
     </div> 

     <div ui-view></div> 
    </body> 

</html>

app.js

angular.module('movieApp', ['ui.router']) 
.config(function($stateProvider, $urlRouterProvider, $locationProvider) { 
    $urlRouterProvider.otherwise('movies'); 
    $stateProvider 
    .state('movies', { 
     'url' : '/movies', 
     templateUrl : 'movies.html' 
    }); 
    $locationProvider.html5Mode(false); 
});

movies.js

angular.module('movieApp').controller('Moviecntrl',function($scope) { 
    $scope.movies=[ 
    {movieName: 'DDLJ'}, 
    {movieName: 'Jack Reacher'}, 
    {movieName: 'Mission Impossible'} 
]; 
});

出典

2017-09-18 21:31:45

tqsm sir.I上記のコードを使用しましたが、ノードサーバーを使用してアプリケーションを実行すると出力を取得できません –

私はappを実行するとjsファイルからコンテンツを取得できません。誰かが助けてくれればより良いでしょう

答えて

関連する問題