2017-08-03 59 views
0

我有一個簡單的搜索框。當輸入框不爲空時,刪除按鈕顯示爲刪除框內的文本。之後,按鈕應該再次消失,直到我再次在框中鍵入內容。AngularJS輸入更改重置

當我手動刪除文本的刪除框正在消失,但是當我按刪除按鈕它不工作。
我必須使用.length嗎?我以前使用.value就是這樣的:
if ($(".form-control").value == '' || $(".form-control").value == $(".form-control").defaultValue) {

在此先感謝。

A = $範圍

a.change = function() { 
     a.limit = 6; 

     var x = a.search; 
     if (x.length == '') { 


      $(".form-inline").removeClass("isset"); 
     } else { 
      $(".form-inline").addClass("isset"); 
     } 
    }; 


    a.clearSearch = function() { 
     a.search = ""; 
     a.limit = 6; 
    }; 

HTML的一部分:

<input type="search" ng-change="change()" ng-model="search" class="form-control" placeholder="Labor durchsuchen..."> 

<div class="icon-close" ng-click="clearSearch()"></div> 
+3

你爲什麼要使用jQuery的角度? –

+0

所以你可以看到哪個div是我的意思 –

+0

當jQuery代碼有本地的angularjs方法來完成相同的時候,將jquery代碼和angularjs混合是不可取的。 –

回答

1

可以使用納克級爲您正在使用jQuery做什麼: -

var app = angular.module("myApp", []); 
 
app.controller("myCtrl", function($scope) { 
 
    
 
    $scope.formData = {}; 
 
$scope.change = function() { 
 
     //do anything here 
 
    }; 
 

 

 
    $scope.clearSearch = function() { 
 
     $scope.formData.search = ""; 
 
    }; 
 
});
<!DOCTYPE html> 
 
<html> 
 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script> 
 
<body> 
 

 
<div ng-app="myApp" ng-controller="myCtrl"> 
 
    
 
<input type="search" ng-class="(formData.search != undefined && formData.search)?'isset':''" ng-change="change()" ng-model="formData.search" class="form-control" placeholder="Labor durchsuchen..."> 
 

 
<div class="icon-close" ng-click="clearSearch()"></div> 
 
</div>

0

你應該能夠刪除的jQuery代碼,只需使用

<div class="icon-close" ng-click="clearSearch()" ng-show="search.length===0"></div> 
0

我認爲你需要觸發您的a.change函數在a.cleanSearch內再次檢查是否輸入了內容或n OT。

a.clearSearch = function() { 
    a.search = ""; 
    a.limit = 6; 
    a.change() 
}; 
相關問題