Fatal编程技术网

Angularjs表代码不工作

angularjs

Angularjs表代码不工作,angularjs,Angularjs,我是个新手。我已经创建了一个html，并且正在从rest服务中获取值。我使用ng repeat将这些值放入表中，但表中未显示这些值，且没有任何错误。请检查一下我的密码 <!DOCTYPE html> <html> <head> <title>Project Management</title> <script type="text/javascript" src="http://ajax.googleapis

我是个新手。我已经创建了一个html，并且正在从rest服务中获取值。我使用ng repeat将这些值放入表中，但表中未显示这些值，且没有任何错误。请检查一下我的密码

<!DOCTYPE html>
<html>

<head>
    <title>Project Management</title>


    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script>

    <script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
    <link type="text/css" ng-href="http://bootswatch.com/flatly/bootstrap.min.css" rel="stylesheet" href="http://bootswatch.com/flatly/bootstrap.min.css">
    <style>
        .table-striped>tbody>tr:nth-of-type(odd) {
            background: #f1f1f1 !important;
        }
    </style>
</head>

<body>
    <style>
        table {
            border: 1px solid #666;
            width: 100%;
        }
        th {
            background: #f8f8f8;
            font-weight: bold;
            padding: 2px;
        }
    </style>
    <button type="button" class="btn btn-info pull-right btn-sm">Logout</button>

    <div ng-app="myApp">
        <div ng-controller="ContactController">

            <button ng-click="add()">Project Details</button>
            <table class="table table-striped">
                <tr>
                    <th>projectid</th>
                    <th>projectname</th>
                    <th>claintid</th>
                    <th>projectstatus</th>
                    <th>prjstartdate</th>
                    <th>prjenddate</th>
                    <th>lastmodified</th>
                    <th>prjpinurl</th>
                    <th>Actions</th>
                </tr>
                <tr ng-repeat="person in people">

                    <td>{{person.projectid}}</td>
                    <td>{{person.projectname}}</td>
                    <td>{{person.claintid}}</td>
                    <td>{{person.projectstatus}}</td>
                    <td>{{person.prjstartdate}}</td>
                    <td>{{person.prjenddate}}</td>
                    <td>{{person.lastmodified}}</td>
                    <td>{{person.prjpinurl}}</td>
                    <td>
                        <button type="button" class="btn btn-info btn-sm" ng-click="Edit(contact)">Edit</button>
                        <button type="button" class="btn btn-info btn-sm" ng-click="Remove(contact)">Remove</button>
                    </td>
                </tr>
            </table>



        </div>
    </div>
    <script type="text/javascript">
        var app = angular.module('myApp', []);

        function ContactController($scope, $http) {
            //   $scope.contacts = ["hi@email.com", "hello@email.com"];
            $scope.people = [];
            $scope.add = function() {


                // $scope.contacts.push($scope.newcontact);
                // $scope.newcontact = "";

                $http.get('http://localhost:8080/ProjectManagement/REST/GetProject/Details').success(function(data, status, headers, config, response) {

                    var json = JSON.stringify(data);

                    var getresponseText = JSON.parse(json);
                    var prjdetails = getresponseText.responseText;

                    var fields = getresponseText.split("|");


                    var projectid = fields[0];
                    var projectname = fields[1];
                    var claintid = fields[2];
                    var projectstatus = fields[3];
                    var prjstartdate = fields[4];
                    var prjenddate = fields[5];
                    var lastmodified = fields[6];
                    var prjpinurl = fields[7];

                    claim = '';

                    claim = '[{';
                    claim += '"projectid": "' + projectid + '", ';
                    claim += '"projectname": "' + projectname + '", ';
                    claim += '"claintid": "' + claintid + '", ';
                    claim += '"projectstatus": "' + projectstatus + '", ';
                    claim += '"prjstartdate": "' + prjstartdate + '", ';
                    claim += '"prjenddate": "' + prjenddate + '", ';
                    claim += '"lastmodified": "' + lastmodified + '", ';
                    claim += '"prjpinurl": "' + prjpinurl + '", ';
                    claim += '}]';
                    alert("before" + claim)
                    $scope.people = claim;


                }).error(function(data, status, headers, config, response) {


                });
            }
        }
    </script>
</body>

</html>


项目管理
.表格带条纹>tbody>tr:n类型（奇数）{
背景：#f1f1！重要；
}
桌子{
边框：1px实心#666；
宽度：100%；
}
th{
背景：#f8f8；
字体大小：粗体；
填充：2px；
}
注销
项目详情
投射
项目名称
克拉因蒂德
项目状态
prjstartdate
普詹达特
最后修改
prjpinurl
行动
{{person.projectid}
{{person.projectname}
{{person.claintid}
{{person.projectstatus}
{{person.prjstartdate}
{{person.prjenddate}
{{person.lastmodified}}
{{person.prjpinurl}}
编辑
去除
var-app=angular.module（'myApp'，[]）；
函数ContactController（$scope，$http）{
//$scope.contacts=[”hi@email.com", "hello@email.com"];
$scope.people=[]；
$scope.add=函数（）{
//$scope.contacts.push（$scope.newcontact）；
//$scope.newcontact=“”；
$http.get（'http://localhost:8080/ProjectManagement/REST/GetProject/Details）.success（函数（数据、状态、标题、配置、响应）{
var json=json.stringify（数据）；
var getresponseText=JSON.parse（JSON）；
var prjdetails=getresponseText.responseText；
var fields=getresponseText.split（“|”）；
var projectid=字段[0]；
var projectname=字段[1]；
var claintid=字段[2]；
var projectstatus=字段[3]；
var prjstartdate=字段[4]；
var prjenddate=字段[5]；
var lastmodified=字段[6]；
var prjpinurl=字段[7]；
索赔=“”；
索赔='[{'；
索赔+='“projectid”：“'+projectid+'”，'；
索赔+=““项目名称”：“+projectname+”，”；
索赔+=''claintid:“'+claintid+'”，'；
索赔+=““项目状态”：“+projectstatus+”，”；
索赔+='“prjstartdate”：“+prjstartdate+'”，'；
索赔+=““prjenddate”：“+prjenddate+”，”；
索赔+='“lastmodified”：“+lastmodified+'”，'；
索赔+='“prjpinurl”：“+prjpinurl+'”，'；
索赔+='}]'；
警报（“之前”+索赔）
$scope.people=索赔；
}).错误（函数（数据、状态、标题、配置、响应）{
});
}
}
尝试在不构建索赔字符串的情况下构建人员数组。应执行以下操作（假设projectId、projectname等具有预期值）：

尝试在不构建索赔字符串的情况下构建人员数组。应执行以下操作（假设projectId、projectname等具有预期值）：

如果看不到最初的反应是什么样子，很难说清楚，但看起来你做了很多不必要的工作

如果将javascript更改为：

var app = angular.module('myApp', []);
function ContactController($scope,$http) {
 //   $scope.contacts = ["hi@email.com", "hello@email.com"];
 $scope.people = [];
 $scope.add = function() {

  // $scope.contacts.push($scope.newcontact);
  // $scope.newcontact = "";

  $http.get('http://localhost:8080/ProjectManagement/REST/GetProject/Details').success(function(data, status, headers, config,response){
        $scope.people = data;
    }).error(function(data, status, headers, config,response) {

    });
  }
}
`
看起来您已经从REST服务返回了一个有效的JSON响应

如果看不到原始响应的确切内容，很难说清楚，但看起来你在做很多不必要的工作

如果将javascript更改为：

var app = angular.module('myApp', []);
function ContactController($scope,$http) {
 //   $scope.contacts = ["hi@email.com", "hello@email.com"];
 $scope.people = [];
 $scope.add = function() {

  // $scope.contacts.push($scope.newcontact);
  // $scope.newcontact = "";

  $http.get('http://localhost:8080/ProjectManagement/REST/GetProject/Details').success(function(data, status, headers, config,response){
        $scope.people = data;
    }).error(function(data, status, headers, config,response) {

    });
  }
}
`
看起来您已经从REST服务返回了一个有效的JSON响应

非常紧急，伙计们，如果有人知道我做错了什么，请把同样的事情发到这里。我需要更多的信息。ajax请求是否成功并按预期返回正确的数据？你都做了些什么？仅仅说
它不起作用
不是一个恰当的问题。我得到了响应，我将它放在json中，使用claim='[{'；claim+=''projectid:“'+projectid+'”；claim+=''projectname:“'+projectname+'”；claim+=''clainId:“+clainId+'”；claim+='“projectstatus:“+projectstatus+”，“；索赔+=”“prjstartdate:“+prjstartdate+”，“；索赔+=”“prjenddate:“+prjenddate+”，”；索赔+=““lastmodified:“+lastmodified+”，”；索赔+=““prjpinurl:“+prjpinurl+”，“；索赔+=”]“；为什么你在使用javascript对象和数组时手动创建json？为什么你将响应数据字符串化？显示从服务器发送的实际json样本我从rest服务1获得样本项目1 |样本项目1 |样本项目1 |样本项目1 |样本项目1 | WIP | null | null | 2015-08-24 16:38:39.0 |非常紧急的家伙们，如果有人知道我做错了什么，请发布sameNothing在这里很紧急。需要更多信息。ajax请求是否成功并按预期返回正确的数据？您进行了哪些故障排除？仅仅说
它不起作用
不是一个正确的问题描述我得到了响应