2017-02-26 114 views
-5

我的网络只与fairfox合作,而不是与CHROM 但是当我与CHROM netbeams运行HTML网页的工作就好了我在代码中的错误,我不知道如何解决

我不知道该怎么办,我需要提交在未来10小时 你可以在这里下载整个项目:

the project

the errores image:

指数HTML:

<html ng-app="MyApp"> 
<head> 
    <title>Web Site Student</title> 
    <meta charset="UTF-8"> 
    <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
    <script src="_scripts/jquery-3.1.1.min.js" type="text/javascript"></script> 
    <script src="_scripts/angular.min.js"></script> 
    <script src="_scripts/angular-route.min.js"></script> 
    <script src="_scripts/myapp.js"></script> 
    <script src="_scripts/ctrols.js" type="text/javascript"></script> 
    <script src="_scripts/json.js" type="text/javascript"></script> 
    <link href="_css/bootstrap.min.css" rel="stylesheet" /> 
    <script src="js/bootstrap.min.js"></script> 
</head> 
<body> 

     <nav class="navbar navbar-inverse"> 
      <div class="container-fluid"> 
       <div class="navbar-header"> 
        <a class="navbar-brand" href="#">WebSiteStudent</a> 
       </div> 
       <ul class="nav navbar-nav"> 
        <li class="active"><a href="#/list">Data</a></li> 
        <li><a href="#/analysis">Analysis</a></li> 
        <li><a href="#/monitor">Monitor</a></li> 
       </ul> 
      </div> 
     </nav> 
    <div ng-view> 

    </div> 
</body> 

ctrols代码:

(function() { 
    'use strict'; 

    angular 
     .module('MyApp') 
     .controller('ListCtrl', ListCtrl); // ControllerName & functionName can be the same name, but not required. 

    ListCtrl.$inject = ['$scope']; 
    function ListCtrl($scope) { 
    $scope.personalDetails = json 

     $scope.addNew = function(){ 
      $scope.personalDetails.push({ 
       'id':"", 
       'name':"", 
       'lastName':"", 
       'email':"", 
       'grade':"", 
       'subject':"", 
      }) 
     } 
     $scope.addNew = function(){ 
      $scope.personalDetails.push({ 
       'id':"", 
       'name':"", 
       'lastName':"", 
       'email':"", 
       'grade':"", 
       'subject':"", 
      }) 
     }  
     $scope.remove = function(){ 
      var newDataList=[] 
      angular.forEach($scope.personalDetails, function(selected){ 
       if(!selected.selected){ 
        newDataList.push(selected) 
       } 
      }) 
      $scope.personalDetails = newDataList 
      json= $scope.personalDetails 
     } 
    } 
})(); 

(function() { 
    'use strict'; 

    angular 
     .module('MyApp') 
     .controller('AnalysisCtrl', AnalysisCtrl); // ControllerName & functionName can be the same name, but not required. 

    AnalysisCtrl.$inject = ['$scope']; 
    function AnalysisCtrl($scope) { 
      $scope.personalDetails = json 

$(document).ready(function() { 
    $.getScript('http://www.chartjs.org/assets/Chart.js',function(){ 

     var data = { 
      labels : ["January","February","March","April","May","June","July"], 
      datasets : [ 
       { 
        fillColor : "rgba(220,220,220,0.5)", 
        strokeColor : "rgba(220,220,220,1)", 
        pointColor : "rgba(220,220,220,1)", 
        pointStrokeColor : "#fff", 
        data : [65,59,90,81,56,55,40] 
       }, 
       { 
        fillColor : "rgba(151,187,205,0.5)", 
        strokeColor : "rgba(151,187,205,1)", 
        pointColor : "rgba(151,187,205,1)", 
        pointStrokeColor : "#fff", 
        data : [28,48,40,19,96,27,100] 
       } 
      ] 
     } 

     var options = { 
      animation: true 
     }; 
     var c = $('#myChart') 
     var ct = c.get(0).getContext('2d') 
     var ctx = document.getElementById("myChart").getContext("2d") 
     new Chart(ctx).Bar(data,options) 

    }) 
}) 
    } 
})(); 

(function() { 
    'use strict'; 

    angular 
     .module('MyApp') 
     .controller('MonitorCtrl', MonitorCtrl); // ControllerName & functionName can be the same name, but not required. 

    MonitorCtrl.$inject = ['$scope']; 
    function MonitorCtrl($scope) { 
     $scope.student = json; 
    } 
})();   

MYAPP代码:

(function() { 
    'use strict'; 

    angular.module('MyApp', [ 
     "ngRoute" 
    ]); 
}()); 

(function() { 
    angular.module('MyApp') 
     .config(
      function ($routeProvider, $locationProvider) { 
       $locationProvider.hashPrefix(''); 
       $routeProvider 
        .when("/list", { 
         templateUrl: "addon/list.html", 
         controller: "ListCtrl" 
        }) 
        .when("/analysis", { 
         templateUrl: "addon/analysis.html", 
         controller: "AnalysisCtrl" 
        }) 
        .when("/monitor", { 
         templateUrl: "addon/monitor.html", 
         controller: "MonitorCtrl" 
        }) 
        .otherwise({ 
         redirectTo: "/list" 
        }) 
      }); 
}()); 
+0

这不公平狐狸 – jao

回答

0

简单地说,你的代码是一个基本的烂摊子。某些地方有多余的字符,而其他字符缺少字符。你没有一个好的文件结构,你引用了不存在的文件(_css/stayle.css),并且你有不合适的缩进。

下一次,请将您的代码上传到github,而不是等待下载的随机网站和外语。

为了更好地理解的角度,其文件结构,请通过约翰爸爸的角1种样式指南阅读: https://github.com/johnpapa/angular-styleguide/blob/master/a1/README.md

和/或由Todd座右铭:https://toddmotto.com/ultimate-guide-to-learning-angular-js-in-one-day/


那据说,我认为你的主要问题在于ctrols.js和myapp.js文件。

为了简单起见,我删除了“SuperCtrl”。您可以在更好地理解Angular时添加它。你myapp.js文件应类似于此:

(function() { 
    'use strict'; 

    angular.module('MyApp', [ 
     "ngRoute" 
    ]); 
}()); 

(function() { 
    angular.module('MyApp') 
     .config(
      function ($routeProvider, $locationProvider) { 
       $locationProvider.hashPrefix(''); 
       $routeProvider 
        .when("/list", { 
         templateUrl: "addon/list.html", 
         controller: "ListCtrl" 
        }) 
        .when("/analysis", { 
         templateUrl: "addon/analysis.html", 
         controller: "AnalysisCtrl" 
        }) 
        .when("/monitor", { 
         templateUrl: "addon/monitor.html", 
         controller: "RemoveCtrl" 
        }) 
        .otherwise({ 
         redirectTo: "/list" 
        }) 
      }); 
}()); 

您的每一个在ctrols.js文件控制器的应该是类似的格式:

(function() { 
    'use strict'; 

    angular 
     .module('MyApp') 
     .controller('ControllerName', functionName); // ControllerName & functionName can be the same name, but not required. 

    functionName.$inject = ['$scope']; 
    function functionName($scope) { 
     // Controller code here 
    } 
})(); 

这应该是足以让你去的正确的方向。

更新代码后,我能看到的数据&分析选项卡的用户界面: enter image description here enter image description here

+0

感谢您的快速repll的我只是开始lern angularjs yasterdy我会更好,我希望短时间:) – jaguar

+0

你可以上升的变化,你做了它仍然不工作给我,我不知道我想和我想看看你做了什么 – jaguar

+0

你在控制台日志中看到什么错误?尝试解决这些问题,如果您不能,请更新您的帖子以包含错误和您所做的更改。确保您的库以正确的顺序导入(即在其他人之前导入jQuery)。在另一张纸条上,你没有选择正确的答案来回答你提出的问题。如果任何答案对您最有帮助,请在您之前的问题中进行检查。 – Ali