Question

控制器：

.controller('BlogController', function(blogFactory, $routeParams, $scope){

    var that=this;

    stat=false;

    this.checkbookmark = function(bId){
    console.log(bId)
    blogFactory.checkBookmark(bId, function(response){
        console.log(response)
        if(response == "bookmarked"){
            that.stat = true;  
        }
        else{
            that.stat = false;  
        }
    })
}

html代码：

<div class="container" ng-controller="BlogController as blogCtrl">

    <div class="row" ng-repeat="chunk in blogCtrl.blogs | filter: filter_name  | orderBy:'-created_at'  | groupBy: 3">


        <div class="outerbox1 col-sm-4" ng-repeat="blog in chunk" >
            <div class="innerbox3"  ng-init="blogCtrl.checkbookmark(blog._id)">
                <br>
                <div> > READ MORE 
                    <a ng-if="blogCtrl.stat" ng-href="#" ng-click="blogCtrl.removebookmark(blog._id)" class="glyphicon glyphicon-heart pull-right">{{blogCtrl.stat}}</a>
                    <a ng-if="!blogCtrl.stat" ng-href="#" ng-click="blogCtrl.addbookmark(blog._id)" class="glyphicon glyphicon-heart-empty pull-right">{{blogCtrl.stat}}</a> 
                </div>

            </div>
        </div>
    </div>
</div>

我想根据 stat

的值显示glyphicon

我有6个博客，前3个是书签，接下来3个不是。

我得到的问题是 stat 值总是根据最后一个书签设置，因此它总是false / true（基于上一篇博客的条件）。

如何解决这个问题？

Answer 1

您应该在博客对象上设置属性（它显然属于对象），而不是在控制器上设置stat属性。

将此支票簿功能替换为：

this.checkbookmark = function(blog){ //pass the entire blog, not just the id
    blogFactory.checkBookmark(blog._id, function(response){
        console.log(response)
        if(response == "bookmarked"){
            blog.stat = true;  //set the property on blog instead of the controller
        }
        else{
            blog.stat = false;  
        }
    })
}

然后像这样使用它：

<div class="innerbox3"  ng-init="blogCtrl.checkbookmark(blog)">
    <br>
    <div> > READ MORE 
        <a ng-if="blog.stat" ng-href="#" ng-click="blogCtrl.removebookmark(blog._id)" class="glyphicon glyphicon-heart pull-right">{{blog.stat}}</a>
        <a ng-if="!blog.stat" ng-href="#" ng-click="blogCtrl.addbookmark(blog._id)" class="glyphicon glyphicon-heart-empty pull-right">{{blog.stat}}</a> 
    </div>
</div>

您需要对add和removebookmark函数

进行类似的更改

显示基于值html angular的glyphicon

1 个答案: