NG-Click 在 Chrome 中不起作用，但在 FireFox 中起作用 [英] NG-Click not working in Chrome but works in FireFox
本文介绍了NG-Click 在 Chrome 中不起作用，但在 FireFox 中起作用的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我有一个 NG-Click 来更改页面上的元素数量(来自 API 调用).NG-Click 使用在 FireFox 中工作的下拉框.但我最近发现，当同事开始使用该服务时，它在 Chrome 中不起作用.我不知道为什么它不起作用，任何帮助表示赞赏.我附上了一个带有代码的 JSFidle.
JavaScript:
app.controller("AppCtrl", function($http, $scope){var app = this;$scope.toLoad=50;$scope.page= 0;$scope.sortArray = [];$scope.filterList = "";函数获取数据(页面){$http.get('/file/filter/' + $scope.toLoad + '/' + $scope.page + '?' + $scope.filterList ).success(function(data){app.info = 数据；控制台日志(数据)；});}$scope.changeLoad = function(toLoad){$scope.toLoad = toLoad;获取数据($scope.page)}}HTML:
<div id="主表"><div class="widget-body no-padding"><div id="select-more"><select class="form-control" name="dt_basic_length" aria-controls="dt_basic" id="box-test" style="width:6%"><option value="10" ng-click="changeLoad(10)">10 </选项><option value="25" ng-click="changeLoad(25)">25 </选项><option value="50" ng-click="changeLoad(50)">50 </选项><option value="100" ng-click="changeLoad(100)">100 </选项><option value="1000" ng-click="changeLoad(1000)">1000 </选项></选择><表格>
<tr ng-repeat="app.info 中的信息 | filter:searchText"><td>{{information.uuid}}</td><td>{{information.publisher}}</td><td>{{information.ts}}</td></tr></tbody>
解决方案
你应该使用 ng-change 请看这里
<div id="主表"><div class="widget-body no-padding"><div id="select-more"><select class="form-control" name="dt_basic_length" aria-controls="dt_basic" id="box-test" style="width:6%" ng-change="update()" ng-model=所选项目"><option value="10">10</option><option value="25">25</option><option value="50">50</option><option value="100">100</option><option value="1000">1000</option></选择><表格>
<tr ng-repeat="app.info 中的信息 | filter:searchText"><td>{{information.uuid}}</td><td>{{information.publisher}}</td><td>{{information.ts}}</td></tr></tbody>js:
var app = angular.module('app', []);app.controller("AppCtrl", function ($http, $scope) {var app = this;$scope.toLoad = 50;$scope.page = 0;$scope.sortArray = [];$scope.filterList = "";$scope.selectedItem = {};函数获取数据(页面){$http.get('/file/filter/' + $scope.toLoad + '/' + $scope.page + '?' + $scope.filterList).success(function (data) {app.info = 数据；控制台日志(数据)；});}$scope.changeLoad = 函数 (toLoad) {$scope.toLoad = toLoad;getData($scope.page);};$scope.update = 函数 () {警报($scope.selectedItem)；};});
I have a NG-Click to change the amount of elements on the page (that are coming from an API call). The NG-Click utilizes a drop down box that works in FireFox. But I recently discovered that it isn't working in Chrome when a co-worker started working on the service. I have no idea as to why it wouldn't work and any help is appreciated. I've attached a JSFidle with the code.
JavaScript:
app.controller("AppCtrl", function($http, $scope){
var app = this;
$scope.toLoad=50;
$scope.page= 0;
$scope.sortArray = [];
$scope.filterList = "";
function getData(page){
$http.get('/file/filter/' + $scope.toLoad + '/' + $scope.page + '?' + $scope.filterList ).success(function(data){
app.info = data;
console.log(data);
});
}
$scope.changeLoad = function(toLoad){
$scope.toLoad = toLoad;
getData($scope.page)
}
}
HTML:
<body ng-app="app" ng-controller="AppCtrl as app" id="body">
<div id="main-table">
<div class="widget-body no-padding">
<div id="select-more">
<select class="form-control" name="dt_basic_length" aria-controls="dt_basic" id="box-test" style="width:6%">
<option value="10" ng-click="changeLoad(10)"> 10 </option>
<option value="25" ng-click="changeLoad(25)"> 25 </option>
<option value="50" ng-click="changeLoad(50)"> 50 </option>
<option value="100" ng-click="changeLoad(100)"> 100 </option>
<option value="1000" ng-click="changeLoad(1000)"> 1000 </option>
</select>
</div>
<table>
<tbody>
<tr ng-repeat="information in app.info | filter:searchText">
<td>{{information.uuid}}</td>
<td>{{information.publisher}}</td>
<td>{{information.ts}}</td>
</tr>
</tbody>
</table>
</div>
</div>
解决方案 You should use ng-change please see here
<body ng-app="app" ng-controller="AppCtrl" id="body">
<div id="main-table">
<div class="widget-body no-padding">
<div id="select-more">
<select class="form-control" name="dt_basic_length" aria-controls="dt_basic" id="box-test" style="width:6%" ng-change="update()" ng-model="selectedItem">
<option value="10">10</option>
<option value="25">25</option>
<option value="50">50</option>
<option value="100">100</option>
<option value="1000">1000</option>
</select>
</div>
<table>
<tbody>
<tr ng-repeat="information in app.info | filter:searchText">
<td>{{information.uuid}}</td>
<td>{{information.publisher}}</td>
<td>{{information.ts}}</td>
</tr>
</tbody>
</table>
</div>
</div>
js:
var app = angular.module('app', []);
app.controller("AppCtrl", function ($http, $scope) {
var app = this;
$scope.toLoad = 50;
$scope.page = 0;
$scope.sortArray = [];
$scope.filterList = "";
$scope.selectedItem = {};
function getData(page) {
$http.get('/file/filter/' + $scope.toLoad + '/' + $scope.page + '?' + $scope.filterList).success(function (data) {
app.info = data;
console.log(data);
});
}
$scope.changeLoad = function (toLoad) {
$scope.toLoad = toLoad;
getData($scope.page);
};
$scope.update = function () {
alert($scope.selectedItem);
};
});
这篇关于NG-Click 在 Chrome 中不起作用，但在 FireFox 中起作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
登录
关闭
扫码关注1秒登录
发送“验证码”获取
|
15天全站免登陆