我使用角度1.4.5与django v1.8应用程序,并尝试为我的网站实现新的布局。 以下是我的观点:
<div class="page animsition" ng-app="AppUI">
<div class="page-content padding-30 blue-grey-500"
ng-controller="DisplayManageController">
<ul>
<li ng-repeat="feed in items">
<a>{{ feed.type }}</a>
<img ng-src="feed.obj.image"/>
<em ng-bind="feed.obj.text"></em>
</li>
</ul>
</div>
</div>
角度控制器代码:
var AppUI = angular.module('AppUI');
AppUI.controller('DisplayManageController', ['$scope', 'display', function ($scope, display) {
$scope._display = display.items({'id': 71});
$scope.items = [];
$scope._display.$promise.then(function (result) {
angular.forEach(result, function (value) {
$scope.items.push(value);
});
});
}]);
承诺更新后的html结果
<li ng-repeat="feed in items" class="ng-scope">
<a></a>
<img ng-src="feed.obj.image" src="feed.obj.image">
<em ng-bind="feed.obj.text" class="ng-binding">Blabla #somehashtagfromme</em>
</li>
以下是&#34;项目&#34;
的内容[
{$$hashKey:"object:3",group_id: 1,id: "562a1a48942fbd0d9016617e",obj:{image:"https://scontent.cdninstagram.com/hphotos-xfa1/t51.2885-15/s640x640/sh0.08/e35/12080420_855923527854550_1926591603_n.jpg",text:"Nefesler tutuldu"},type:"instagram"},
{$$hashKey:"object:2",group_id: 1,id: "5627a75e942fbd0d7ed19748",obj:{image:"https://pbs.twimg.com/media/CR2VePxUwAAVqtn.jpg", text:"bu zamanların ruhu"},type:"twitter"},
...
]
ng-repeat将所有项目重复为Feed对象,但为什么花括号和ng-src不会编译或返回空值?
Ps:我也试过ng-src = {{feed.obj.text}},但结果没有改变..
答案 0 :(得分:0)
应该是ng-src="{{feed.obj.text}}"
。这是引号和双花括号。
如果不起作用,请在<pre>{{feed.obj | json}}</pre>
之后和</a>
之前粘贴<img>
。这将让你看到对象的问题。
此外,由于您正在使用Django,请确保您将模板渲染为原始模板。否则django会认为双花括号是django模板。
答案 1 :(得分:0)
以下是您的代码的一部分:
http://plnkr.co/edit/khgxkLt2FjskrguWP5Js?p=preview
您需要围绕正在插值的项目使用花括号。
<ul>
<li ng-repeat="feed in items">
<a>{{ feed.type }}</a>
<img ng-src="{{feed.obj.image}}"/>
<em ng-bind="{{feed.obj.text}}"></em>
</li>
</ul>