2017-02-26 135 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

相關問題