Question

我似乎无法让我的Wordpress JSON工作。我是AngularJS和Ionic世界的新手，所以我一直在阅读和观看教程。

这是我app.js文件的相关部分：

(function() {

var app = angular.module('mybodyapp', ['ionic', 'angularMoment','LocalStorageModule']);

app.config(function($stateProvider, $urlRouterProvider) {
    $stateProvider.state('index', {
        url : '/',
        templateUrl : 'index.html',
        controller : 'MainController'
    });
    $stateProvider.state('list', {
        url: '/list',
        templateUrl: 'templates/list.html'
    });
    $stateProvider.state('edit', {
        url: '/edit/:noteId',
        templateUrl: 'templates/edit.html',
        controller: 'EditCtrl'
    });
    $stateProvider.state('add', {
        url: '/add',
        templateUrl: 'templates/edit.html',
        controller: 'AddCtrl'
    });
    $stateProvider.state('notes', {
        url: '/notes',
        templateUrl: 'templates/notes.html'
    });
    $stateProvider.state('posts', {
        url: '/posts',
        templateUrl: 'templates/posts.html',
        controller: 'PostsCtrl'
    });
    $urlRouterProvider.otherwise("/");
});

// ...

我可以通过控制器从Reddit获取数据，但不能从Wordpress获取数据。我找到了一个很好的演示模板，但无法弄清楚如何'重写'JS控制器的开头。我删除了原始angular.module('starter.controllers', [])的顶部并将angular.module('mybodyapp')后跟：

.controller('AppCtrl', function($scope, $timeout, $rootScope) {
    $rootScope.url = 'http://scottbolinger.com/wp-json/wp/v2/';
})
.controller('PostsCtrl', function( $scope, $http, DataLoader, $timeout, $ionicSlideBoxDelegate, $rootScope ) {
    console.log('PostsCtrl');

    $scope.loadPosts = function() {
        DataLoader.get( $rootScope.url + 'posts' ).then(function(response) {
            $scope.posts = response.data;
            console.log( response.data );
        }, function(response) {
            console.log('error', response);
        });
    }

    // Load posts on page load
    $scope.loadPosts();

    paged = 2;
    $scope.moreItems = true;

    // Load more (infinite scroll)
    $scope.loadMore = function() {
        if( !$scope.moreItems ) {
            return;
        }

        var pg = paged++;

        $timeout(function() {
            DataLoader.get( $rootScope.url + 'posts' + '?page=' + pg ).then(function(response) {
                angular.forEach( response.data, function( value, key ) {
                    $scope.posts.push(value);
                });

                if( response.data.length <= 0 ) {
                    $scope.moreItems = false;
                }
            }, function(response) {
                $scope.moreItems = false;
                console.log('error');
            });

            $scope.$broadcast('scroll.infiniteScrollComplete');
            $scope.$broadcast('scroll.resize');
        }, 1000);
    }

    $scope.moreDataExists = function() {
        return $scope.moreItems;
    }

    // Pull to refresh
    $scope.doRefresh = function() {
        console.log('Refreshing!');

        $timeout( function() {
            $scope.loadPosts();

            //Stop the ion-refresher from spinning
            $scope.$broadcast('scroll.refreshComplete');
        }, 1000);
    };
})
.controller('PostCtrl', function($scope, $stateParams,     DataLoader,    $ionicLoading, $rootScope, $sce ) {
    $ionicLoading.show({
        noBackdrop: true
    });

    var singlePostApi = $rootScope.url + 'posts/' +    $stateParams.postId;

    DataLoader.get( singlePostApi ).then(function(response) {
        $scope.post = response.data;
        // Don't strip post html
        $scope.content =    $sce.trustAsHtml(response.data.content.rendered);
        $ionicLoading.hide();
    }, function(response) {
        console.log('error', response);
    });
  });

Answer 1

ng-app指令中的名称必须与您的模块名称匹配。 ng-controller指令中的名称必须与您的控制器名称匹配。

有关ng-app指令的详细信息，请参阅AngularJS ng-app API Reference。

对于ng-controller指令，AngularJS ng-controller API Reference

<强>更新

你抓住的演示有三个控制器。您需要使用angular.module

的方法

angular.module('mybodyapp').controller('AppCtrl',... 

angular.module('mybodyapp').controller('PostsCtrl', function( $sc

angular.module("mybodyapp").controller('PostCtrl', function($scope

Controller无法下载Wordpress JSON数据

1 个答案: