当我尝试删除按钮并附加新按钮时Angularjs出错？

我有以下几点：

'user strict';

var SaurioApp = angular.module('SaurioApp', []);

SaurioApp.controller('SearchCtrl', function($scope, $http){
    $scope.followUser = function(user_id,follow_to_id){
        $http.get('ajax/follow', {
            params: {user_id: user_id,follow_to_id: follow_to_id}
        }).success(function(data){
            $scope.unfollow = '<button class="btn btn-danger" ng-  click="followUser({{Auth::user()->id}},{{$user->id}})">Seguir</button>';
        });
    }

});

“用户严格”；
var SaurioApp=angular.module（'SaurioApp'，[]）；
控制器（'SearchCtrl'，函数（$scope，$http）{
$scope.followUser=函数（用户标识，跟随到标识）{
$http.get（'ajax/follow'{
参数：{user_id:user_id，follow_to_id:follow_to_id}
}).成功（功能（数据）{
$scope.unfollow='Seguir'；
});
}
});

以及刀片中的视图

<div class="row" ng-app="SaurioApp">
    <div class="col-xs-12 col-sm-12 col-md-12" >
        <p ng-controller="SearchCtrl" >
            @{{ unfollow }}
            <button class="btn btn-primary" ng-click="followUser({{Auth::user()->id}},{{$user->id}})">Follow</button>
        </p>
    </div>
</div>

@{{unfollow}
跟随

---

插入成功，但我无法删除“Follow”按钮并附加新按钮：“Unfollow”。我如何才能做到这一点？

似乎只需要更改CSS类和按钮文本，因此在本例中，与其尝试通过作用域发送HTMl代码，不如发送一个变量并使用ng类进行切换。大概是这样的：

 <button value="{{(unfollow=false)? 'Follow' : 'Seguir'}}" ng-class="{btn-danger: unfollow=false }" ng-click="followUser({{Auth::user()->id}},{{$user->id}})"></button>

“用户严格”

var SaurioApp = angular.module('SaurioApp', []);

SaurioApp.controller('SearchCtrl', function($scope, $http){
    $scope.followUser = function(user_id,follow_to_id){
$scope.unfollow=false;
        $http.get('ajax/follow', {
            params: {user_id: user_id,follow_to_id: follow_to_id}
        }).success(function(data){
            $scope.unfollow = true;
        });
    }

});

<div class="row" ng-app="SaurioApp">
    <div class="col-xs-12 col-sm-12 col-md-12" >
        <p ng-controller="SearchCtrl" >
            @{{ unfollow }}
            <button ng-class="{btn-danger: unfollow=false }" ng-click="followUser({{Auth::user()->id}},{{$user->id}})">Follow</button>
        </p>
    </div>
</div>

var SaurioApp=angular.module（'SaurioApp'，[]）；
控制器（'SearchCtrl'，函数（$scope，$http）{
$scope.followUser=函数（用户标识，跟随到标识）{
$scope.unfollow=false；
$http.get（'ajax/follow'{
参数：{user_id:user_id，follow_to_id:follow_to_id}
}).成功（功能（数据）{
$scope.unfollow=true；
});
}
});

@{{unfollow}
跟随

您还可以通过以下方式动态更改按钮文本：

 <button value="{{(unfollow=false)? 'Follow' : 'Seguir'}}" ng-class="{btn-danger: unfollow=false }" ng-click="followUser({{Auth::user()->id}},{{$user->id}})"></button>

---

我想关键是不需要重新创建HTML代码，只需更改元素。

如果动态添加HTML，则需要$compile。插入成功后，将按钮转到html并打开ngShow会更容易，但我发现在某些情况下，隐藏/显示有时会在瞬间同时出现。我认为干式原理可能适用于这里，而类和按钮文本实际上是所有需要更改的内容。代码更少。即使使用相同的隐藏/显示变量，如：ng show='unfollow'和ng hide='unfollow'，也会发生这种情况吗。我已经更新了代码是，在某些情况下，我发现在代码加载和ng hide/ng show逻辑触发之间有一点延迟。无论哪种方式，它都可以用更少的代码来完成，这最终（在我看来）是更好的实践。

<div class="row" ng-app="SaurioApp">
    <div class="col-xs-12 col-sm-12 col-md-12" >
        <p ng-controller="SearchCtrl" >
            <button ng-show='unfollow' class="btn btn-danger" ng-click="followUser({{Auth::user()->id}},{{$user->id}})">Seguir</button>
            <button ng-hide='unfollow' class="btn btn-primary" ng-click="followUser({{Auth::user()->id}},{{$user->id}})">Follow</button>
        </p>
    </div>
</div>