2016-05-14 23 views
1

私はjsonファイルからデータを取得しようとしていますが、私はすでにここですべてのオプションをチェックしていますが、誰も私のために働いているわけではありません。他に、JSONとは、あなたがそれはあなたの生命維持のように見える私AngularJs 1は動作しません

appClients.js

(function(){ 
    var app = angular.module('customer',[]); 
    alert('Success'); 
    app.controller("CustomerController",function($scope,$http){ 
     $http.get('../customer.json') 
     .success(function(data) { 
      // $scope.phones = data; 
      alert('Success'); 
     }) 
     .error(function(data){ 
      alert('Error'); 
     }); 
    }); 
}); 

index.htmlを

<!DOCTYPE HTML> 
<html ng-app="customer"> 
    <head> 
     <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css"> 
     <link rel="stylesheet" type="text/css" href="css/style.css"> 
    </head> 
    <body class="Master" ng-controller="CustomerController as customer"> 
     <script type="text/javascript" src="js/angularjs.min.js"></script> 
     <script type="text/javascript" src="js/appClients.js"></script> 
     <header id="MasterHeader"> 

     </header> 

     <div class="container"> 
      <div class="row"> 
       <div class="col-lg-12"> 
        <div class="col-lg-6" id="CustomerList" ng-repeat="product in customer.clients"> 
         <h3>{{product.id}}</h3> 
        </div> 
        <div class="col-lg-6" id="CustomerDetails">Details</div> 
       </div> 
      </div> 
     </div> 

     <footer id="MasterFooter"> 

     </footer> 

    </body> 
</html> 
+0

なぜjQueryを使用していますか? –

+0

あなたの開発ツールを見てください。コンソールに何かエラーがありますか?そのAJAXコールは実際に何かを返すか、404を受け取るか? – Pevara

+0

既にデベロッパーツールをチェックしましたが、解決策を見つけられませんでした –

答えて

4

を助けることを願って、インデックスファイルの同じレベルにそのファイル(Immedia呼び出された関数式)が実行されていません。 appClient.jsファイルを

に更新してください。

最後の行に追加の()があることに注意してください。これにより、最初の「成功」アラートが表示されます。

あなたのajax呼び出しが成功した場合、$scopeプロパティを、結果がHTMLで参照される$scopeプロパティと一致するように設定する必要があります。現在のスニペットに基づいて、コントローラーの結果は$scope.phoneに設定されているようですが、HTMLでは$scope.customerと表示されます。

+0

角度コードが動作しました。ありがとうございます。しかし、AJAX呼び出しはエラーを返します。 –

+0

エラーメッセージは何ですか?あなたはdevツール(通常はF12)でデバッグするか、 'console.log(data)'を使ってコンソールにエラーを記録することができます。これが別の問題であれば、別の質問を作成すると有益かもしれません。 – detaylor

関連する問題