Currently, I am in the process of learning AngularJS and facing a challenge involving inserting a 'sanitised' title into an h2
element within a ng-repeat
. Although all other aspects are functioning correctly, I am struggling to retrieve the 'title' value from the array object. Here is the issue summarized.
The following is the HTML code snippet:
<div ng-repeat="question in questions" ng-show="!!questions.length" class="question-list">
<h2><a ng-href="{{question.link}}" title="{{question.title}}" target="_blank" ng-bind-html="title"></a></h2>
</div>
Provided below is the corresponding JS block:
var loadFeed = angular.module('loadFeed', ['ngSanitize']);
loadFeed.controller('feedController', ['$scope', '$http', function($scope, $http) {
$scope.questions = [];
$http({
method: 'GET',
url: 'https://api.stackexchange.com/2.2/questions?pagesize=10&order=desc&sort=votes&tagged=angular&site=stackoverflow'
}).then(function(feed) {
console.log('success');
console.log(feed);
$scope.questions = feed.data.items;
console.log($scope.questions);
$scope.title = $scope.questions.title; // This is what I need for the ng-bind
},function(error) {
console.log('error');
console.log(error);
});
}]);
While this code successfully retrieves an individual value (the first item's title):
$scope.title = $scope.questions[0].title;
I actually require the output of this line (which currently returns blank):
$scope.title = $scope.questions.title;
I have attempted using both angular.forEach
and a JavaScript loop, but these methods only duplicate every heading within a single list item. Could someone point out if there is something crucial that I might be overlooking?