0

有NG专家吗?

我无法让我的工厂 (VIEWservices) 将 JSON 添加到新视图 casetudy.php。

我想要实现的是,当您单击具有功能(openCase)的帖子时,它会在 ng-view 中显示 casetudy.php(有效),但我无法让它显示该帖子的相关内容。

我认为这是一个非常简单的解决方法,只是看了几个小时并且没有任何乐趣。

HTML

<div ng-controller="homeCtrl">           
    <div ng-repeat="post in posts">
        <h1 ng-bind="post.title"></h1>

        <a ng-click="openCase(post.slug)">view more</a>

        <p ng-bind="post.id"></p>
    </div>

<!-- page content -->
    <div ng-view></div>


</div>

JS

var app = angular.module('appname', ['ngSanitize'])


app.config(function ($routeProvider, $locationProvider){
    $locationProvider.hashPrefix("!")
    $routeProvider
    .when('/:slug',
    {
        templateUrl: 'wp-content/themes/name/views/casestudy.php',
        controller: 'caseCtrl'
    })
    .otherwise('/')
});


app.controller('homeCtrl', function($scope, VIEWservices, $route, $location) {
   $scope.posts = VIEWservices.getPosts();

   console.log($scope.posts);

   $scope.openCase = function(caseSLUG) {
        // open a post by its slug
       console.log(caseSLUG);
       $location.path("/" + caseSLUG)
    }
});


app.controller('caseCtrl', function($scope, VIEWservices, $routeParams) {
    $scope.post = VIEWservices.getPosts()[$routeParams.slug];
    console.log($scope.post);
});


app.factory('VIEWservices', function($http) {
   return {
     getPosts: function() {
       return $http.get('wp-content/themes/name/ajax/homepage-casestudies.php').then(function (result) {
         return result.data;
       })
     }
   }
});
4

3 回答 3

1

您工厂的 getPosts 函数是异步的。您需要使用.then它来获取它的返回值。在您的控制器中,尝试将您的代码更改为:

app.controller('caseCtrl', function($scope, VIEWservices, $routeParams) {
    var posts = VIEWservices.getPosts();
    posts.then(function(data)
    {
        $scope.post = data[$routeParams.slug];
    });
});
于 2013-11-07T21:56:47.507 回答
0

我不确定这是您正在寻找的东西,但它可能会帮助您解决问题。要使用 JSON,请尝试以下操作:

将 $http 注入您的控制器,然后获取 json,如下所示:

$http.get('data/' + $scope.filename + '.json').success(function (data) {
    $scope.retrievedJson = data;
});

这将使用检索到的 json 文件的内容填充 retrievedJson 变量,使其可用于范围。

于 2013-11-07T22:33:19.460 回答
0

由于您的问题不完整,我会问自己以下问题:

  • caseCtrl 中的 console.log($scope.post) 将什么写入控制台?
  • caseCtrl 中 $routeParams.slug 的值是多少?

另一方面,当你只需要一个帖子时,为什么你总是得到所有的帖子?您可以尝试在您的工厂中添加另一种方法以仅获得一个帖子,如下所示:

getPost: function(postSlug) {
   return $http.get('wp-content/themes/name/ajax/homepage-casestudies.php?slug=' + postSlug).then(function (result) {
       return result.data;
   })
}

您当然需要在您的 php 文件中添加登录名才能获得一种情况。

于 2013-11-07T22:46:52.757 回答