gpt4 book ai didi

javascript - 为什么 ng-click 不起作用?

转载 作者:行者123 更新时间:2023-12-03 11:36:49 24 4
gpt4 key购买 nike

我写了一个指令来实现 ng-disabled,因为我只能使用 1.1.5 版本的 angularjs,它不提供 ng-disabled,所以

tableApp.directive('myDisabled', function($compile) {
return {
restrict: 'A',
replace: true,
scope: {
myDisabled: '='
},
link: function(scope, element, attrs) {
var test = scope.$eval(attrs.myDisabled);
console.log(test);
scope.$watch(attrs.myDisabled, function (test) {
if (test) {
element.attr();
}
else {
element.attr('disabled', 'false');
}
});
}
};
});

html代码:

<html ng-app="tableApp">
<head></head>
<body>
<div ng-controller="TableCtrl">
<input ng-model="page"/>
<button class="btn btn-primary" ng-click="previouspage()" my-disabled="page <=1">上一页</button>
</div>
</body>
</html>

但是为什么我点击这个按钮,它无法调用函数previouspage()

这是我的 angularjs 代码

var tableApp = angular.module('tableApp', [], function ($httpProvider) {
$httpProvider.defaults.headers.post['Content-Type'] =
'application/x-www-form-urlencoded;charset=utf-8';
});

tableApp.directive('myDisabled', function($compile) {
return {
restrict: 'A',
replace: true,
scope: {
myDisabled: '='
},
link: function(scope, element, attrs) {
var test = scope.$eval(attrs.myDisabled);
console.log(test);
scope.$watch(attrs.myDisabled, function (test) {
if (test) {
element.attr();
}
else {
element.attr('disabled', 'false');
}
});
$compile(attrs);
}
};
});

tableApp.controller('TableCtrl', function ($scope, $http) {

$scope.page = 1;
$scope.getCr = function getCr(later) {
var url = '/cms/copyright/find';
var request = $http({
method: 'get',
url: url,
params: {
page_length: 25,
start: ($scope.page - 1) * 25,
s: ''
}
});

request.then(function (data) {
if (data.data.result == 'OK') {
console.log(data.data);
$scope.copyright = data.data;
if (later != undefined) {
later();
}
}
});
};

$scope.nextpage = function nextpage() {
$scope.page += 1;
$scope.getCr();
};

$scope.onepage = function onepage() {
$scope.page = 1;
$scope.getCr();
};

$scope.previouspage = function previouspage() {
$scope.page -= 1;
$scope.getCr();
};

$scope.setPos = function setPos(index, holder_id) {
var pos = window.prompt("请输入排序位置", $scope.copyright.items[index].pos);
console.log(pos);
if (pos != null && pos != "" && parseInt(pos) > 0) {
var a = 'holder_id=' + holder_id + '&pos=' + pos;
$http.post('/cms/copyright/top', a).then(function (data) {
data = data.data;
if (data.result == 'OK') {
$scope.getCr(function () {
$scope.copyright.items[index].change = true;
});
} else {
alert(data.result);
}
});
}

console.log($scope.copyright.items[index]);
};

$scope.getCr();
});

最佳答案

您的问题与$scope有关。

当您在指令中显式创建隔离作用域(使用作用域:{})时,您无法直接访问父作用域。如果不这样做,这样做也没有问题。

所以,简而言之,只需在 HTML 模板中将 ng-click="previouspage()" 更改为 ng-click="$parent.previouspage()" .

相关的插件在这里:http://plnkr.co/edit/WRflPF enter image description here

您还可以重构指令的 link 函数并删除不必要的属性。所以指令可以是:

app.directive('myDisabled', function () {
return {
restrict: 'A',
scope: {
myDisabled: '='
},
link: function(scope, element) {
scope.$watch('myDisabled', function (val) {
element.attr('disabled', val);
});
}
};
});

关于javascript - 为什么 ng-click 不起作用?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26459708/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com