简体   繁体   中英

AngularJs. Data loaded via ajax doesn't shown in View

) I have a trouble with rendering ajax answer into View.

There is my View

    <div id="content" layout:fragment="content" ng-app="Messages">
    <div class="twitter" ng-repeat="tweet in tweets" ng-model="tweets">
                <span> <input type="checkbox" name="active"
                    ng-checked="isSelected($event)" class="publishCheckbox"
                    data-id="{{tweet.socialId}}" ng-controller="publishController"
                    ng-click="publishMessage($event)" /></span> <span>{{tweet.createdAt}}</span>
                <span>{{tweet.network}}</span> <span>{{tweet.text}}</span>
            </div>
            <button type="button"
                class="btn btn-default navbar-btn twitter-posts"
                ng-controller="getMoreTweets" ng-click="onloadTweets($event)">Get
                more tweets</button></div>

And this is my controller

    var app = angular.module("Messages", []);
app.controller('getMoreTweets', function($http, $scope, $element) {
    $scope.tweets = [];
    $scope.onloadTweets = function(e) {
        var buttonElement = angular.element(e.target);
        var socialId = buttonElement.prev().prev().children().children().attr(
                "data-id");
        var dataString = {
            'socialId' : socialId
        };
        $http({
            method : 'GET',
            url : "/infoboard/getMoreTweets",
            params : dataString
        }).success(function(data, status, headers, config) {
            $scope.tweets = data;
            console.log(data);
            console.log($scope.tweets);
            console.log("All correct");
        }).error(function(data, status, headers, config) {
            console.log("Something went wrong");
        });
    };
    $scope.isSelected = function(e) {
        return $scope.selected.indexOf(angular.element(e.target)) >= 0;
    };
});

Data comes from server as it should be, but not rendering into view( What i'm doing wrong?

When you use tweets in ng-repeat directive, tweets must exist in current scope. You declare tweets in controller scope, but controller scope is limited by button element. So the scope of ng-repeat know nothing about tweets.
Place you ng-controller directive on wrapper div of ng-repeat
HTML:

<div id="content" layout:fragment="content" ng-app="Messages" ng-controller="getMoreTweets">

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM