2016-09-21 31 views
0

大街创建了一个应用程序在我的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>

+0

你有一个理由使用的角度非常非常过时的版本? –

+0

不,我只是试过应该仍然可以工作 –

回答

1

你还没有指定什么NG-模型。纠正我,如果我错了,但我没有看到你的整个代码中的任何ng模型。

+0

为什么他需要ng-model来显示用户数据? –

+0

这个问题并不清楚,但我相信他正尝试将用户添加到某个数组中,因为有按钮分配的ng键功能。 – MSH

+0

对不起我的错误我的意思是在我的表达 –

0

你如何改变你的范围?通过click()函数?你可以发布吗?
顺便说一句,你不需要$scope.$apply()内部的角度操作(在这种情况下$ http.get),因为它会自动执行此操作。

1

你在你的代码

1)不正确的HTML 2次失误。头标签包括身体标签。 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>

+0

对不起,我注意到我已经犯了这个HTML错误,但让我们忽略它。你看到那里的ng-click是另一个功能工作正常,所以只是忽略它 –

+0

也许是它的我的php代码,但我没有看到它的任何错误 –

+0

好吧,试着改变你的代码来做和我的例子一样。它应该适合你。比逐步更换网址和绑定找到错误的地方。 –