Question

我想问一下如何使用angularjs制作DOM，但没有任何页面重新加载，所以这里是代码

<div class="container-customscroll">
    <div class="content mCustomScrollbar">
        <div class="itemcheck" ng-repeat="item in dataItem | regex:'name':alfabet | orderBy: 'name' | filter: searchItem">
             <div class="left" ng-if="item.preparation == ''"><i class="fa fa-circle silver"></i>{{item.name}}</div>
             <div class="left" ng-if="item.preparation == '1'"><i class="fa fa-circle green"></i>{{item.name}}</div>
              <div class="left" ng-if="item.preparation == '2'"><i class="fa fa-circle yellow"></i>{{item.name}}</div>
             <div class="left" ng-if="item.preparation == '3'"><i class="fa fa-circle pink"></i>{{item.name}}</div>
                      <div class="right" ng-click="tambahItem(item)" ng-if="item.button == 'add'"><a>+ Tambahkan</a></div>
                        <div class="hapus" ng-click="delete(item.master_code)" ng-if="item.button == 'remove'"><a>Hapus</a></div>
                                            </div>

这是角度代码：

发布数据：

$scope.tambahItem = function(clickedData){
      var url = '/url';
        $http({
        method: 'POST',
        url: url,
        data: {
            "code": clickedData.master_code,
            "nama": clickedData.name,
            "preparation": clickedData.preparation
        }
      }).success(function(data){
        alert(clickedData.name + " telah ditambahkan");
        $scope.tambahkanKeCart();
      })
    };

这是删除功能：

$scope.delete = function (id) {
       if(confirm('Anda yakin ingin menghapus order ini?')){
           var url = '/url'
              $http({
                  method: "DELETE",
                  url: url + "/" + id
              }).success(function(data){
                  alert("data telah dihapus");
                  $window.location.reload();
              }).error(function(data){
                  alert("Tidak bisa dihapus");
                  $window.location.reload();
              });
           }else{
               return false;
           }
    };

在上面的代码中有2 ng-if，如果显示某个值，则在最后一行中都是if情况。我的问题是如何制作ng - 如果在没有重新加载的情况下工作，你可以在dev.pesanlab.com/order/pemeriksaan

中看到我当前的问题

正如您所看到的，问题是，当您点击＆＃34; tambahkan＆＃34;按钮，它不会改为＆＃34; hapus＆＃34;按钮，而不是必须在hapus按钮出现之前重新加载。

我希望每个人都能理解我的问题，非常感谢你的答案。

Answer 1

试试这个 -

$scope.tambahItem = function(clickedData){
      var url = '/url';
        $http({
        method: 'POST',
        url: url,
        data: {
            "code": clickedData.master_code,
            "nama": clickedData.name,
            "preparation": clickedData.preparation
        }
      }).success(function(data){
        alert(clickedData.name + " telah ditambahkan");
        $scope.tambahkanKeCart();
       $scope.dapatkanItem();
      })
    };

On Succes，我调用了'$scope.dapatkanItem()'，它将获得'dataItems'的更新列表，而angular将再次自动绑定'dataItem'。

HTML DOM使用AngularJS Ng-if函数

1 个答案: