私のAngularJSスコープはモデルでは更新されていません

アベニューでmysqlデータベースにすべてのユーザを表示するアプリケーションを作成しましたが、すべて正常に動作しますが、PHPコードがデータを含むjsonを返すと、私のAngularJSスコープはモデルでは更新されていません

<!Doctype html> 
 
<html> 
 
    <head> 
 
\t  <title>Simple Dynamic Score Board | By Kascique Lowmans</title> 
 
\t \t <meta charset="utf-8"/> 
 
       <link rel="stylesheet" href="style.css"/> 
 
\t  <script src="http://code.angularjs.org/1.2.13/angular.js"></script> 
 
\t \t <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
 
\t </head> 
 
\t <script> 
 

 
\t   var webapp = angular.module('myapp', []); 
 
\t \t \t webapp.controller('myusers', function($scope, $http){ 
 
    \t \t \t  $scope.users = []; 
 
\t \t \t \t $http.get("selectdata.php").then(function(response){ 
 
\t \t \t \t  $scope.users = response.data; 
 
            $scope.$apply(); 
 
            alert($scope.users); 
 
             
 
\t \t \t \t }); 
 
           // $scope.$watch("users", function(){ alert('users scope changed');}); 
 
\t \t \t \t 
 
\t \t \t }); 
 
\t \t \t 
 
\t \t \t 
 
\t \t \t 
 
\t  </script> 
 
\t <body data-ng-app="myapp" > 
 
\t <div class="control-group"> 
 
\t \t \t <h1>Select a user</h1> 
 
\t \t \t <div data-ng-controller="myusers" > 
 
\t \t \t \t <label class="control control--radio" data-ng-repeat="x in users"><span>{{$index + 1}}</span> {{ x.firstname +' '+x.lastname }} <b>{{ x.score}}</b> 
 
\t \t \t \t \t <input type="radio" name="radio"/> 
 
\t \t \t \t \t <div class="control__indicator"></div> 
 
\t \t \t \t </label><br/> 
 
           <h1 id="trail"></h1> 
 
\t \t \t \t <button ng-click="click()">+ Add score</button> 
 
\t \t \t </div> 
 
\t \t \t <footer> 
 
       &copy; copyright <a href="http://www.kasciquelowmans.ml/">Kascique Lowmans</a> 
 
      </footer> 
 
\t </div> 
 
\t </body> 
 
</html>

出典

2016-09-21 Kascique Lowmans

あなたが角度の非常に非常に古いバージョンを使用する理由はありますか？ –

いいえ、私はちょうどまだ動作するはずです。 –

あなたはNG-モデルには何も割り当てられていません。私が間違っている場合は私を修正してください。しかし、あなたのコード全体にng-modelは表示されません。

出典

2016-09-21 19:22:10 MSH

彼はユーザーデータを表示するためにng-modelが必要ですか？ –

質問は明確ではありませんが、ボタンにng-click機能が割り当てられているので、彼は何人かのアレイにユーザーを追加しようとしていると思います。 – MSH

申し訳ありませんが私のミス私の表現で意味する –

どのようにスコープを変更しますか？ click（）関数を使用しますか？投稿できますか？
ところで、それは自動的に行うので、角演算（この場合は$ http.get）の内部に$scope.$apply()は必要ありません。

出典

2016-09-21 19:26:51

コードに2つのエラーがありました

1）間違ったhtml。ヘッドタグにはボディタグが含まれます。 2）$ http promiseコールバックから$ scope.applyを呼び出すべきではありません。これはAngularによって呼び出されるためです。

以下はわずかに変更されています。

var webapp = angular.module('myapp', []); 
 
\t \t \t webapp.controller('myusers', function($scope, $http){ 
 
    \t \t \t $scope.users = []; 
 
\t \t \t \t $http.get("https://randomuser.me/api/?results=10").then(function(response){ 
 
        $scope.users = response.data.results; 
 
             
 
\t \t \t \t }); 
 
\t \t \t \t $scope.regUser = function(index){ 
 
\t \t \t \t \t  $scope.thereguser = index; 
 
\t \t \t \t } 
 

 
\t \t \t \t 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div class="control-group" data-ng-app="myapp"> 
 
\t \t \t <h1>Select a user</h1> 
 
\t \t \t <div data-ng-controller="myusers" > 
 
\t \t \t \t <label class="control control--radio" data-ng-repeat="x in users"><span>{{$index + 1}}</span> {{ x.name.first }} <b>{{ x.score}}</b> 
 
\t \t \t \t \t <input type="radio" name="radio"/> 
 
\t \t \t \t \t <div class="control__indicator"></div> 
 
\t \t \t \t </label><br/> 
 
           <h1 id="trail"></h1> 
 
\t \t \t \t <button ng-click="click()">+ Add score</button> 
 
\t \t \t </div> 
 
\t \t \t <footer> 
 
       &copy; copyright <a href="http://www.kasciquelowmans.ml/">Kascique Lowmans</a> 
 
      </footer> 
 
\t </div>

出典

2016-09-21 19:39:39

申し訳ありません私はそのhtmlエラーを作りましたが、無視することができます。あなたがそこに見るng-clickはうまく動いているので、それを無視するだけです。 –

多分私のPHPコードですが、何も間違っているとは見えません。 –

OK、私の例と同じようにコードを変更しよう。それはあなたのために働くはずです。ステップURLとバインディングで置き換えて、どこがエラーであるかを見つけるよりも。 –

私のAngularJSスコープはモデルでは更新されていません

答えて

関連する問題