Angular 变量未按预期显示
Angular variable not displaying as expected
我确定这是相对简单的事情,但我现在没有看到它,所以我希望其他人会看到它。
这是我的相关 HTML:
<html>
<head>
<base href="/">
<script src="js/angular.min.js"></script>
<script src="js/jquery.js"></script>
<script src="js/script.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="css/style.css">
<meta charset="UTF-8">
</head>
<body ng-app="LKSU">
...
<div class="container-fluid">
<div class="main-content" ng-controller="HomeController">
<div class="attorney" ng-repeat="attorney in attorneys">
{{attorney.name}}
</div>
</div>
</div>
<!-- Modules -->
<script src="js/app.js"></script>
<!-- Controllers -->
<script src="js/controllers/HomeController.js"></script>
<!-- Services -->
<script src="js/services/attorneys.js"></script>
<br clear="all" />
</body>
</html>
app.js:
var app = angular.module('LKSU', []);
attorneys.js
app.factory('attorneys', ['$http', function($http) {
return $http.get('/js/services/attorneys.json')
.success(function(data) {
return data;
})
.error(function(err) {
alert(err);
return err;
});
}]);
HomeController.js
app.controller('HomeController', ['$scope', 'attorneys', function($scope, attorneys) {
attorneys.success(function(data){
$scope.attorneys = data;
console.log($scope.attorneys);
});
}]);
当我查看 Chrome 中的控制台时,JSON 数据已经通过,但是当我循环遍历它时没有任何显示。我真的很想最终限制 ID 号,但我想让我先循环一遍以确保它在那里,但它没有出现。
我想这一定是我调用 ng-repeat 的方式,因为我已经验证数据位于 $scope.attorneys.
想法?
谢谢!
这是JSON
{"attorneys":
[
{
"id":1,
"name":"Mitchell B. Goldberg",
"position":"Partner",
"piclink": "images/Mitch.jpg",
"quotes":
[
{
"id": 1,
"quote": "Wonderful guy!",
"person": "Dovie"
},
{
"id": 2,
"quote": "If ye be wanting a haggis like no other, Mitchell be yer man!",
"person": "Angus McLoed"
},
{
"id": 3,
"quote": "Wotta Hottie!",
"person": "Natasha"
}
],
"bio": "<p>Mitchell B. Goldberg, who started with Lawrence Kamin in 2001, focuses his practice on commercial litigation, concentrating in securities and commodity futures law and alternative dispute resolution. He is also a trained mediator.</p><p>His reputation for keeping the \"big picture\" in mind, rather than focusing solely on the individual case or issue before him, recently helped a large client with multiple FINRA arbitration claims that all had the same arbitrator as a panelist, but were not all represented by Lawrence Kamin. When that panelist ruled negatively in Mitch's case, Mitch contemplated bringing a motion to strike the arbitrator under FINRA guidelines prohibiting panelists from serving on multiple cases involving the same respondents. Even though this would have substantially advanced his own case, he instead suggested a conference call with all of the client's outside attorneys handling the remaining arbitrations to determine a joint strategy that would provide the biggest benefit to the mutual client. Ultimately the motion to strike was successfully brought in the case most likely to benefit.</p><p>He is also well-respected for his integrity, honesty and candor, which have earned him the trust of many judges and opposing counsel. This strength has often allowed Mr. Goldberg to achieve consensus in cases where other people wouldn't be able to achieve an agreement. For example, in one matter, distrust among the attorneys and parties resulted in a refusal of the plaintiffs to even discuss settlement. Mitch stepped in and, due to the opposing attorney's mutual respect, helped negotiate a settlement satisfactory to both sides.</p><p>Mitch's active membership on the boards of various legal committees and law societies, including the Chicago Bar Association and the Decalogue Society of Lawyers, reinforces his intent to continually improve the legal profession, as well as his desire to provide the best possible guidance to clients by keeping abreast of the latest developments in the law. Mitch has lectured to the Decalogue Society of Lawyers and taught securities litigation at IIT's Chicago-Kent College of Law with other members of the firm.</p><p>When not working for clients, serving on various boards or teaching, Mitch loves spending time with his wife Natasha and their four beautiful children, Rachel, Zachary, Jesse and Abigale.</p>",
"email": "mgoldberg@lksu.com",
"fax": "312.372.2389",
"phone":"312.924.4263",
"areas": ["altdispute", "litigation", "securities"],
"experience": "Lawrence, Kamin, Saunders & Uhlenhop LLC<br/> Partner: 2007-Present<br/> Associate: 2001-2007<br/><br/>Blau & Bonavich, 1999-2001",
"education": "DePaul University, J.D., with honor, 1999<br/> <em>Order of the Coif</em><br/><br/>DePaul University, B.A., highest honor, 1996",
"honors": "2008 - 2010, 2012 - 2014<br/> Rising Star in Securities Litigation,<br/> Super Lawyers Magazine<br/><br/>2011 Decalogue Award of Excellence<br/><br/>2011 DePaul 14 under 40",
"articles": "Y",
"bar_admissions": "State ofIllinois",
"court_admissions": "United States District Courts<br/> Northern District of Illinois<br/> Seventh Circuit Court of Appeals",
"memberships": "Chicago Bar Association<br/> Co-Chair, ADR Committee, 2005-2007<br/><br/>Chicago Lincoln Inn of Court<br/> Pupilage Co-Chair, 2006-2010<br/> Mentoring VP, 2012-Present<br/><br/>National Inns of Court<br/> Illinois State Liaison, 2009-Present<br/><br/>Decalogue Society of Lawyers<br/> Board of Managers, 2006-Present<br/><br/>DePaul University College of Liberal Arts & Sciences Deans Advisory Board, Vice Chair<br/> 2010 to present"
}
]
}
您的律师列表在您的 JSON 数据中的 .attorneys
属性 上,而您没有访问它。您正在将整个对象分配给 $scope.attorneys
.
您需要访问该数组,因此您可以对其进行迭代:
app.controller('HomeController', [
'$scope',
'attorneys',
function($scope, attorneys) {
attorneys.success(function(data){
$scope.attorneys = data.attorneys; // <-- here
console.log($scope.attorneys);
});
}
]);
如果你这样做,一切都会好起来的。
我确定这是相对简单的事情,但我现在没有看到它,所以我希望其他人会看到它。
这是我的相关 HTML:
<html>
<head>
<base href="/">
<script src="js/angular.min.js"></script>
<script src="js/jquery.js"></script>
<script src="js/script.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="css/style.css">
<meta charset="UTF-8">
</head>
<body ng-app="LKSU">
...
<div class="container-fluid">
<div class="main-content" ng-controller="HomeController">
<div class="attorney" ng-repeat="attorney in attorneys">
{{attorney.name}}
</div>
</div>
</div>
<!-- Modules -->
<script src="js/app.js"></script>
<!-- Controllers -->
<script src="js/controllers/HomeController.js"></script>
<!-- Services -->
<script src="js/services/attorneys.js"></script>
<br clear="all" />
</body>
</html>
app.js:
var app = angular.module('LKSU', []);
attorneys.js
app.factory('attorneys', ['$http', function($http) {
return $http.get('/js/services/attorneys.json')
.success(function(data) {
return data;
})
.error(function(err) {
alert(err);
return err;
});
}]);
HomeController.js
app.controller('HomeController', ['$scope', 'attorneys', function($scope, attorneys) {
attorneys.success(function(data){
$scope.attorneys = data;
console.log($scope.attorneys);
});
}]);
当我查看 Chrome 中的控制台时,JSON 数据已经通过,但是当我循环遍历它时没有任何显示。我真的很想最终限制 ID 号,但我想让我先循环一遍以确保它在那里,但它没有出现。
我想这一定是我调用 ng-repeat 的方式,因为我已经验证数据位于 $scope.attorneys.
想法?
谢谢!
这是JSON
{"attorneys":
[
{
"id":1,
"name":"Mitchell B. Goldberg",
"position":"Partner",
"piclink": "images/Mitch.jpg",
"quotes":
[
{
"id": 1,
"quote": "Wonderful guy!",
"person": "Dovie"
},
{
"id": 2,
"quote": "If ye be wanting a haggis like no other, Mitchell be yer man!",
"person": "Angus McLoed"
},
{
"id": 3,
"quote": "Wotta Hottie!",
"person": "Natasha"
}
],
"bio": "<p>Mitchell B. Goldberg, who started with Lawrence Kamin in 2001, focuses his practice on commercial litigation, concentrating in securities and commodity futures law and alternative dispute resolution. He is also a trained mediator.</p><p>His reputation for keeping the \"big picture\" in mind, rather than focusing solely on the individual case or issue before him, recently helped a large client with multiple FINRA arbitration claims that all had the same arbitrator as a panelist, but were not all represented by Lawrence Kamin. When that panelist ruled negatively in Mitch's case, Mitch contemplated bringing a motion to strike the arbitrator under FINRA guidelines prohibiting panelists from serving on multiple cases involving the same respondents. Even though this would have substantially advanced his own case, he instead suggested a conference call with all of the client's outside attorneys handling the remaining arbitrations to determine a joint strategy that would provide the biggest benefit to the mutual client. Ultimately the motion to strike was successfully brought in the case most likely to benefit.</p><p>He is also well-respected for his integrity, honesty and candor, which have earned him the trust of many judges and opposing counsel. This strength has often allowed Mr. Goldberg to achieve consensus in cases where other people wouldn't be able to achieve an agreement. For example, in one matter, distrust among the attorneys and parties resulted in a refusal of the plaintiffs to even discuss settlement. Mitch stepped in and, due to the opposing attorney's mutual respect, helped negotiate a settlement satisfactory to both sides.</p><p>Mitch's active membership on the boards of various legal committees and law societies, including the Chicago Bar Association and the Decalogue Society of Lawyers, reinforces his intent to continually improve the legal profession, as well as his desire to provide the best possible guidance to clients by keeping abreast of the latest developments in the law. Mitch has lectured to the Decalogue Society of Lawyers and taught securities litigation at IIT's Chicago-Kent College of Law with other members of the firm.</p><p>When not working for clients, serving on various boards or teaching, Mitch loves spending time with his wife Natasha and their four beautiful children, Rachel, Zachary, Jesse and Abigale.</p>",
"email": "mgoldberg@lksu.com",
"fax": "312.372.2389",
"phone":"312.924.4263",
"areas": ["altdispute", "litigation", "securities"],
"experience": "Lawrence, Kamin, Saunders & Uhlenhop LLC<br/> Partner: 2007-Present<br/> Associate: 2001-2007<br/><br/>Blau & Bonavich, 1999-2001",
"education": "DePaul University, J.D., with honor, 1999<br/> <em>Order of the Coif</em><br/><br/>DePaul University, B.A., highest honor, 1996",
"honors": "2008 - 2010, 2012 - 2014<br/> Rising Star in Securities Litigation,<br/> Super Lawyers Magazine<br/><br/>2011 Decalogue Award of Excellence<br/><br/>2011 DePaul 14 under 40",
"articles": "Y",
"bar_admissions": "State ofIllinois",
"court_admissions": "United States District Courts<br/> Northern District of Illinois<br/> Seventh Circuit Court of Appeals",
"memberships": "Chicago Bar Association<br/> Co-Chair, ADR Committee, 2005-2007<br/><br/>Chicago Lincoln Inn of Court<br/> Pupilage Co-Chair, 2006-2010<br/> Mentoring VP, 2012-Present<br/><br/>National Inns of Court<br/> Illinois State Liaison, 2009-Present<br/><br/>Decalogue Society of Lawyers<br/> Board of Managers, 2006-Present<br/><br/>DePaul University College of Liberal Arts & Sciences Deans Advisory Board, Vice Chair<br/> 2010 to present"
}
]
}
您的律师列表在您的 JSON 数据中的 .attorneys
属性 上,而您没有访问它。您正在将整个对象分配给 $scope.attorneys
.
您需要访问该数组,因此您可以对其进行迭代:
app.controller('HomeController', [
'$scope',
'attorneys',
function($scope, attorneys) {
attorneys.success(function(data){
$scope.attorneys = data.attorneys; // <-- here
console.log($scope.attorneys);
});
}
]);
如果你这样做,一切都会好起来的。