从控制器中修改范围变量。致电

时间:2015-06-20 19:18:11

标签: javascript angularjs node.js

好的,所以,让我们开始道歉,如果之前有人问过,我真诚地道歉,如果这个问题非常愚蠢。

我对AngularJS很新,并且最近成功地通过了CORS错误,通过Parse登录,我甚至用Express.js在NodeJS中为我的应用程序编写了一个API,我刚刚遇到了一些困难的障碍

基本上,我有一些代码,这就是它的外观:

         $http.get('http://localhost:3000/users?id=' + CryptoJS.MD5(config.SERVER_KEY)).then(function(resp) {
           //console.log('Success', resp);
           $scope.post = resp.data;
         }, function(err) {
           console.error('ERR', err);
           $scope.post = err;
         })

我的API路由器/用户实际上是误导性的,但这只是从我的数据库中获取一堆帖子并显示它。看看它是否成功,它会将它保存在$ scope.post变量中,但是比如说我是"完成"有帖子,看过帖子。点击一个按钮后,"删除它"它从数组中删除。所以这是我的代码的样子:

        $scope.next = function() {
          $scope.post.shift();
        }

不幸的是,它似乎无法奏效。我甚至尝试过#34;删除$ scope.post [0]"都失败了。

我很确定我做错了什么,如果有人可以帮助我并指出我的错误或正确的方向,那会很棒吗?非常感谢你!

编辑,以下是我的HTML页面代码的外观:

<div class="item center">
  <h2>{{post[0].title}}</h2>
</div>

<div class="item item-body" align="center">
  <div ng-if="post[0].postType == 'image'">
    <img src="{{post[0].postBody}}" height="{{width}}" width="{{width}}" />
  </div>
  <div ng-if="post[0].postType == 'text'">
    <p>"{{post[0].postBody}}"</p>
  </div>

  <div class="item tabs tabs-secondary tabs-icon-left">
   <a class="tab-item" ng-onClick="next()">
    <i class="icon ion-arrow-right-c"></i>
     NEXT!
   </a>
   <a class="tab-item" href="#" ng-onClick="like({{post[0].id}})">
    <i class="icon ion-heart"></i>
     Like ({{post[0].likes}})
   </a>
  </div>

</div>

编辑2以下是$ scope.post的外观:

[{"likes":1,"ownerId":"uVziWLz1uy","postBody":"This is the very, first, ever, post.","postType":"text","title":"Hello World","objectId":"Q2wnN9S3Kg","createdAt":"2015-05-10T19:48:46.216Z","updatedAt":"2015-06-20T16:37:21.800Z"},{"likes":55,"ownerId":"uVziWLz1uy","postBody":"http://images7.alphacoders.com/311/311587.jpg","postType":"image","title":"Nature","objectId":"lVFQIxUbyU","createdAt":"2015-06-20T17:25:39.752Z","updatedAt":"2015-06-20T17:26:40.590Z"}]

2 个答案:

答案 0 :(得分:1)

首先,这将是一个评论,但我没有代表发表评论。我刚刚测试了你的代码并且它可以工作,假设$ scope.post是一个有效的对象或字符串数​​组。

我假设响应中还有其他内容,数据是数组吗?如果没有,那就是你的问题。删除&#34; .data&#34;部分来自resp。

$scope.post = resp.data;

编辑:lol,所以问题出在html中,来自评论:

这一行

<a class="tab-item" ng-onClick="next()"> 

应该是

<a class="tab-item" ng-click="next()">

提醒我们所有人,ng-click是javascript&#34; onClick&#34;的不直观过渡。

答案 1 :(得分:1)

由于$scope.post是一个数组,我假设您可能在视图中使用下一个按钮绑定到当前范围来循环遍历这个数组。

<ul>
  <li ng-repeat="p in post">
    {{ p }}
    <button ng-click="next( $index )">Next</button>
  </li>
</ul>

所以现在你可以在下一次点击按钮时删除该元素。

$scope.next = function( i ) {
  $scope.post.splice( i, 1 );
}