我们是 JavaScript 和 AngularJS 的新手,但场景非常简单。我们想要设置从 REST 服务接收的 html 属性。
这是我们的 profileController.js:
angular
.module('app')
.controller('profileController', ['$scope', '$http', '$window', function($scope, $http) {
// REST service works properly
var resource = 'http://localhost:8080/user';
$http.get(resource).then(function(result){
// logs right json
console.log(result);
// no effect
$scope.content = result.data.toString();
// no effect
if(!$scope.$$phase) {
$scope.$apply();
}
});
} ]);
个人资料.html
<div>
<div class="container">
<br><br><br>
<h2 class="sub-header">Profile</h2>
<div class="table-responsive">
<table class="table table-striped">
<thead>
<tr>
<th>#</th>
<th>Forename</th>
<th>Name</th>
<th>Role</th>
<th>E-Mail</th>
</tr>
</thead>
<tbody>
<tr>
<td>{{profile.data}}</td>
<!-- Doesn't work as well
<td>{{profile.forename}}</td>
<td>{{profile.lastname}}</td>
<td>{{profile.role}}</td>
<td>{{profile.email}}</td>-->
</tr>
<div id="container" ng-controller="profileController">
<content-item forename="item"></content-item>
</div>
</tbody>
</table>
</div>
</div>
</div>
REST服务正常工作并发送回json,JavaScript控制台中的日志输出是正确的,只是html中的设置不起作用,我们完全没有线索。
提前致谢!
最佳答案
考虑这个Plunk .
app.controller("myController", [
"$scope",
function($scope){
$scope.content = [
{
"firstname": "Natalie",
"lastname": "Portman",
"role": "Accountancy",
"email": "n.p@email.com"
},
{
"firstname": "Johnny",
"lastname": "Depp",
"role": "Sales Management",
"email": "j.d@email.com"
},
{
"firstname": "Kevin",
"lastname": "Costner",
"role": "Crisis control",
"email": "k.c@email.com"
},
];
}]);
上面的 $scope.content
是 $scope.content = result.data;
的硬编码模拟。
及用法:
<tr ng-repeat="profile in content">
<td>#</td>
<td>{{profile.firstname}}</td>
<td>{{profile.lastname}}</td>
<td>{{profile.role}}</td>
<td>{{profile.email}}</td>
</tr>
检查 Plunk获取完整代码。
PS:我将示例中的 {{profile.data}}
更改为 #
,因为我不知道它应该是什么。
关于javascript - AngularJS 设置 html 属性,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34043460/