Angular ng-repeat的調用輸入焦點更改

我有幾個使用篩選器搜索綁定的輸入框。所以當我刪除一個字符時，顯示結果會自動更新。但我有很多輸入框，我不想將鼠標導航到每個輸入並手動刪除文本。Angular ng-repeat的調用輸入焦點更改

所以我所做的是有清除了所有的輸入框

function clearForm() { 
    $('#searchcompanyName').val(''); 
    $('#searchbusinessLN').val(''); 
... and so on

這將清除出形式，但它不更新的角度搜索結果中的文本的功能。怎麼能拿角更新的內容是在輸入

.controller('srchJobOrdersCtrl', function (Jobs, socketio) { 
var vm = this; 

vm.search = { 
    date: '', companyName: '', businessLN: '',  
    guideName: '', guideLN: '', phoneNum: '', citizenshipNo: '',  
    totalPeople: '', cashChina: '', cashThailand: '', tourManNo: '', licensePlate: '', 

    arrvDate: '', 
    deptDate: '', 
    arrFltNo: '', 
    staying: '', 
    deptNo: '', 
    time: '', 

    cashThailand: '', 
    cashThailand: '', 


}; 

Jobs.getJobsOrders() 
    .success(function(data) { 
     vm.jobOrders = data; 
    }); 

vm.clearSearch = function() { 
     vm.search = { 
     date: '', companyName: '', businessLN: '',  
     guideName: '', guideLN: '', phoneNum: '', citizenshipNo: '',  
     totalPeople: '', cashChina: '', cashThailand: '', tourManNo: '', licensePlate: '', 

     arrvDate: '', 
     deptDate: '', 
     arrFltNo: '', 
     staying: '', 
     deptNo: '', 
     time: '', 

     cashThailand: '', 
     cashThailand: '', 
    }; 
};

HTML

<label id='searchLabelT' class='searchLabel'></label> 
<input type="text" class="form-control inputWidth3" placeholder="" id='searchcompanyName' ng-model='search.companyName'> 
<input type="text" class="form-control inputWidth3" placeholder="" id='searchbusinessLN' ng-model='search.businessLN'> 
<input type="text" class="form-control inputWidth3" placeholder="" id='searchguideName' ng-model='search.guideName'> 
<input type="text" class="form-control inputWidth3" placeholder="" id='searchguideLN' ng-model='search.guideLN'> 
<input type="text" class="form-control inputWidth3" placeholder="" id='searchphoneNum' ng-model='search.phoneNum'> 



<tbody> 
<tr ng-repeat="each in allJobsOrder.jobOrders | reverse | filter:search"> 
<td>{{ $index + 1 }}</td> 
<td>{{ each.date }}</td> 
<td>{{ each.companyName }}</td> 
<td>{{ each.businessLN }}</td> 
<td>{{ each.guideName }}</td> 
<td>{{ each.guideLN }}</td> 
<td>{{ each.phoneNum }}</td>

來源

2015-08-15 Photonic

向我們顯示您的輸入框的HTML代碼。所以這將更好地解釋你。 –

不要使用jQuery更新輸入框。只需將相應的模型值設置爲空。所以，你的控制器功能將是這個樣子：

$scope.clearForm = function() { 
    $scope.search.companyName = ''; 
    $scope.search.businessLN = ''; 
    // ... and so on 
};

上面的例子表明您已設置了像ng-model="search.companyName"綁定等

來源

2015-08-15 09:48:04 dfsq

嗨Dfsq ....我嘗試這樣做，但不是清除表單。請參閱我上面的編輯帖子 – Photonic

什麼是您的HTML？ – dfsq

我重新編輯我的文章....我的代碼真的很長，所以我不得不爲了可讀性而剪掉它。爲什麼當我做vm.search.companyName ='';不清除我的表格 – Photonic

Jquery的清除輸入，但不更新的角度車型。

，讓您的工作完成後，你可以在角一個onclick功能清除輸入創建一個按鈕：

<button ng-click="clearForm()">Clear</button>

這將調用一個函數在你的控制器

$scope.clearForm = function() { 
    $scope.search.companyName = ''; // binds to ng-model='search.companyName' 
    $scope.search.businessLN = ''; // binds to ng-model='search.businessLN' 
    // ... and so on 
};

這種方法將從您的角度模型中清除值，就像您的輸入值一樣。

來源

2015-08-15 15:01:30

Angular ng-repeat的調用輸入焦點更改

回答

相關問題