AngularJs 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>

为什么使用jQuery？ –

看看你的开发工具。你在控制台中是否有任何错误？这个ajax调用实际上是否返回任何内容，或者你得到一个404？ – Pevara

已经检查开发工具，但没有找到解决方案 –

答

它看起来像你的IIFE （立即直接调用函数表达式）没有被执行。更新您的appClient.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'); 
     }); 
    }); 
})();

注意额外()上最后一行。这应该允许您看到最初的“成功”警报。

如果您的ajax调用成功，您需要制作$scope属性，结果设置为与HTML中引用的$scope属性保持一致。根据当前片段，您似乎将控制器中的结果设置为$scope.phone，但在HTML中参考$scope.customer。

现在角码的工作，非常感谢，但ajax调用返回错误，它可能是什么？ –

你的错误信息是什么？你应该能够在开发工具中调试（通常是F12）或者使用'console.log（data）'将错误记录到控制台。如果这是一个单独的问题，那么创建一个单独的问题可能是有益的。 – detaylor

AngularJs 1不工作

相关推荐