角度解析：構文エラー

角度

angular.js:13708 Error: [$parse:syntax] http://errors.angularjs.org/1.5.7/$parse/syntax?p0=Code&p1=is%20an%20unexpected%20token&p2=7&p3=x.Zip%20Code&p4=Code 
    at angular.js:38 
    at throwError (angular.js:14343) 
    at t.ast (angular.js:14096) 
    at ud.compile (angular.js:14559) 
    at kc.parse (angular.js:15488) 
    at g (angular.js:15653) 
    at k (angular.js:12233) 
    at aa (angular.js:9604) 
    at $b (angular.js:8633) 
    at t (angular.js:8429)(anonymous function) @ angular.js:13708

HTMLファイルを使用してMySQL DBからのデータを表示しようとしたとき、私はこのエラーを取得しています

：

<!DOCTYPE html> 
<html lang="en"> 


<head> 
    <meta charset="utf-8"> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <title> Visual Analytics - Smart Grid App</title> 

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script> 
    <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" integrity="sha384- BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> 
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384- Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script> 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.7/angular.min.js"> 
    </script> 

    <style> 
    table, 
    th, 
    td { 
     border: 1px solid black; 
     border-collapse: collapse; 
    } 

    th, 
    td { 
     padding: 5px; 
     text-align: left; 
    } 

    table#t01 { 
     width: 100%; 
     background-color: #ffffff; 
     font-weight: medium; 
     width: 99 
    } 
    </style> 
</head> 

<body ng-app="app"> 

    <a href="images\SPSLOGO.png"><img src="C:/nodeprojects/myapp/images/SPSLOGO.png" width="300"></a> 
    <img src="C:/Users/RCallaway/AWS/myapp/images/woman_SPS.jpg" width="75%"> 
    <h1 align="center"><i><strong>PRATT & WHITNEY United Technogies</strong></i></h1> 
    <h1 align="center"><i><strong>Visual Analtyics For The Smart Grid Web APP</strong></i></h1> 
    <div class="col-sm-8 col-sm-offsanodet-2"> 
    <div class="page-header"> 
     <h3><strong>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Pratt & Whitney Visual Analtyics For The Smart Grid</br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Web APP will allow</strong><strong> you to search Electric and Gas</br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;usage by Zip Code, County,</strong><strong> or Month.</strong></h3></div> 
    <div ng-controller="emp"> 
     <form class="form-inline"> 
     <div class="form-group"> 
      <span id="tab"><label>Enter Search Criteria:</label></span> 
      <input type="text" class="form-control" ng-model="searchFname" /> 
     </div> 
     <button class="btn btn-primary" ng-click="Btn = true" ng-init="Btn = false"> 
      SEARCH</button> 
     <button class="btn btn-danger" ng-click="Btn = false"> 
      CLEAR</button> 
     </form> 
     <hr> 
     <div class="row"> 
     <table class="table table-bordered"> 

      <tr> 
      <th>Zip Code</th> 
      <th>County</th> 
      <th>Month</th> 
      <th>City</th> 
      <th>Type</th> 
      <th>Meter Reading Dates</th> 
      <th>Kwh Used</th> 
      <th>BGE Electric</th> 
      <th>Gas Type</th> 
      <th>Therms Used</th> 
      <th>BGE Gas Delivery Service</th> 
      <th>BGE Gas Commodity</th> 
      <th>TOTAL AMOUNT DUE</th> 
      </tr> 

      <tr ng-repeat="x in employeeData | filter : searchFname" ng-if="Btn == true"> 

      <td>{{x.Zip Code }}</td> 
      <td>{{x.County }}</td> 
      <td>{{x.Month }}</td> 
      <td>{{x.City }}</td> 
      <td>{{x.Type }}</td> 
      <td>{{x.Meter Reading Dates }}</td> 
      <td>{{x.Kwh Used }}</td> 
      <td>{{x.BGE Electric }}</td> 
      <td>{{x.Gas Type }}</td> 
      <td>{{x.Therms Used }}</td> 
      <td>{{x.BGE Gas Delivery Service }}</td> 
      <td>{{x.BGE Gas Commodity }}</td> 
      <td>{{x.TOTAL AMOUNT DUE }}</td> 
      </tr> 
      </tbody> 
     </table> 
     </div> 
    </div> 
    </div> 
</body> 
</html>

出典

2016-11-26 Reginald Callaway

あなたはアクセスするためのオブジェクトキーの間にスペースを使用することはできませんこれらのキーの値はx.Zipコードのような種類のキー値にアクセスするために使用できますx ['郵便番号]]

私の働くコードはここにあります。

<!DOCTYPE html> 
<html lang="en"> 


<head> 
    <meta charset="utf-8"> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <title> Visual Analytics - Smart Grid App</title> 
    <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" integrity="sha384- BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> 
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384- Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script> 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.7/angular.min.js"></script> 

    <style> 
    table, 
    th, 
    td { 
     border: 1px solid black; 
     border-collapse: collapse; 
    } 

    th, 
    td { 
     padding: 5px; 
     text-align: left; 
    } 

    table#t01 { 
     width: 100%; 
     background-color: #ffffff; 
     font-weight: medium; 
     width: 99 
    } 
    </style> 
    <script> 
    angular.module('app',[]) 
    .controller('employeeCtrl',['$scope', function($scope){   
     $scope.employeeData = [ 
      { 
       "Zip Code" : "213", 
       "County":"India", 
       "Month":"January", 
       "City":"Ahmedabad", 
       "Type":"test", 
       "Meter Reading Dates":"test", 
       "Kwh Used":"test", 
       "BGE Electric":"test", 
       "Gas Type":"test", 
       "Therms Used":"test", 
       "BGE Gas Delivery Service":"test", 
       "BGE Gas Commodity":"test", 
       "TOTAL AMOUNT DUE":"2145" 
      }, 
      { 
       "Zip Code" : "213", 
       "County":"India", 
       "Month":"March", 
       "City":"Surat", 
       "Type":"test", 
       "Meter Reading Dates":"test", 
       "Kwh Used":"test", 
       "BGE Electric":"test", 
       "Gas Type":"test", 
       "Therms Used":"test", 
       "BGE Gas Delivery Service":"test", 
       "BGE Gas Commodity":"test", 
       "TOTAL AMOUNT DUE":"2145" 
      } 
     ] 
    }]); 
    </script> 
</head> 

<body ng-app="app"> 
<a href="images\SPSLOGO.png"><img src="C:/nodeprojects/myapp/images/SPSLOGO.png" width="300"></a> 
    <img src="C:/Users/RCallaway/AWS/myapp/images/woman_SPS.jpg" width="75%"> 
    <h1 align="center"><i><strong>PRATT & WHITNEY United Technogies</strong></i></h1> 
    <h1 align="center"><i><strong>Visual Analtyics For The Smart Grid Web APP</strong></i></h1> 

    <div class="col-sm-8 col-sm-offsanodet-2"> 
    <div class="page-header">  
    <div > 
     <form class="form-inline"> 
     <div class="form-group"> 
      <span id="tab"><label>Enter Search Criteria:</label></span> 
      <input type="text" class="form-control" ng-model="searchFname" />   
     </div> 
     <button class="btn btn-primary" ng-click="Btn = true" ng-init="Btn = false"> 
      SEARCH</button> 
     <button class="btn btn-danger" ng-click="Btn = false"> 
      CLEAR</button> 
     </form> 
     <hr> 
     <div class="row" ng-controller ="employeeCtrl" > 
     <table class="table table-bordered"> 

      <tr> 
      <th>Zip Code</th> 
      <th>County</th> 
      <th>Month</th> 
      <th>City</th> 
      <th>Type</th> 
      <th>Meter Reading Dates</th> 
      <th>Kwh Used</th> 
      <th>BGE Electric</th> 
      <th>Gas Type</th> 
      <th>Therms Used</th> 
      <th>BGE Gas Delivery Service</th> 
      <th>BGE Gas Commodity</th> 
      <th>TOTAL AMOUNT DUE</th> 
      </tr> 

      <tr ng-repeat="x in employeeData | filter : searchFname"> 

      <td>{{x['Zip Code'] }}</td> 
      <td>{{x['County'] }}</td> 
      <td>{{x.Month }}</td> 
      <td>{{x.City }}</td> 
      <td>{{x.Type }}</td> 
      <td>{{x['Meter Reading Dates'] }}</td> 
      <td>{{x['Kwh Used'] }}</td> 
      <td>{{x['BGE Electric'] }}</td> 
      <td>{{x['Gas Type'] }}</td> 
      <td>{{x['Therms Used'] }}</td> 
      <td>{{x['BGE Gas Delivery Service'] }}</td> 
      <td>{{x['BGE Gas Commodity'] }}</td> 
      <td>{{x['TOTAL AMOUNT DUE'] }}</td> 
      </tr> 
      </tbody> 
     </table> 
     </div> 
    </div> 
    </div> 
</body> 
</html>

出典

2016-11-26 05:48:11

お世話になりましたが、お返事いただいた日のうちに、私は自分でこのことを考え出しました。しかし、もう一度、助けてくれてありがとう。あなたがAngularをうまく利用しているなら、私はもう少し助けを借りることができたらいいと思う。私はAngularを約2ヶ月間使用しています。私はそれを愛しています。ありがとう –

角度解析：構文エラー

答えて

関連する問題