宗旨
我正在尝试让管理员和客户在不同阶段展示,管理员可以在单击 toggleShowDiv()
后发布数据,允许客户查看数据。
问题
如何通过!isAdmin()
进入 ng-if
?目前,我只收到 isAdmin
默认。
是否能够按 TD(逐行)将其发布到表 TD 中?不确定,我在这里写正确的代码。
我的想法
我可以使用 ng-if
给每一个TD = isAdmin()
或 !isAdmin
,并通过点击功能控制?
$scope.showDiv = isAdmin();
$scope.toggleShowDiv = function (auction) {
var title = 'text.......';
var text = 'are you sure?';
ConfirmModal(title, text, function () {
$scope.showDiv = !isAdmin() ;
});
};
HTML
<div ng-if="showDiv">
<tbody class="auction-group" ng-repeat="a in foos">
<td ng-if="isAdmin()">
<input type="checkbox" ng-click="toggleShowDiv()" />
</td>
</div>
更新
isAdmin()
只是一个从后端传递的函数。function isAdmin() {
return !!($aScope.currentUser && $aScope.currentUser.isAdministrator);
}
请注意:问题与
isAdmin()
无关功能,它工作正常。我想要做的是使用点击功能来显示和隐藏表格行。
最佳答案
看看这个。在这里,您有 2 个用户同时在线,dude1(管理员)和 dude2(非管理员)。您可以通过调用后端来不断检查显示是否有效,从而将显示从管理员端切换到非管理员端。要在表格行上进行切换,您只需添加 ng-if
到<tr>
元素。
var app = angular.module('app', []);
app.controller("controller", function($scope) {
$scope.dude1 = {admin: true, name: [{name: 'A+', country:'India', publish: true}, {name: 'A', country:'Unknown', publish: true}]};
$scope.dude2 = {admin: false, name: [{name: 'A+', country:'India', publish: true}, {name: 'A', country:'Unknown', publish: true}]};
$scope.toggler = (index) => {
$scope.dude1.name[index].publish = !$scope.dude1.name[index].publish;
};
$scope.names = (dude) => {
return dude.name;
};
setInterval(() => {
/**
* Any backed function to get and repopulate the data.
* Update the value of publish from the server. I'm just using
* the other guys data. But you should fetch it from the server.
*/
$scope.dude2 = valfromServer();
// console.log($scope.dude2, $scope.dude1);
}, 2000);
var valfromServer = () => {
return {
admin: false,
name: $scope.dude1.name
};
};
$scope.publish = (dude, index) => {
return dude.admin || dude.name[index].publish;
};
$scope.isAdmin = (dude) => {
return dude.admin;
};
});
<!DOCTYPE html>
<html>
<head>
<script data-require="angular.js@1.6.0" data-semver="1.6.0" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.0/angular.js"></script>
</head>
<body ng-app="app" ng-controller="controller">
<span>Admin Panel</span>
<div>
<table style="width:40%">
<tr ng-repeat="x in names(dude1)" ng-if="publish(dude1, $index)">
<td>{{ x.name }}</td>
<td>{{ x.country }}</td>
<td>{{ $index }}</td>
<td><button ng-click="toggler($index)" ng-if="isAdmin(dude1)">Publish</button></td>
</tr>
</table>
</div>
<hr>
<span>Non admin panel</span>
<div>
<table style="width:40%">
<tr ng-repeat="x in names(dude2)" ng-if="publish(dude2, $index)">
<td>{{ x.name }}</td>
<td>{{ x.country }}</td>
<td>{{ $index }}</td>
<td><button ng-click="toggler($index)" ng-if="isAdmin(dude2)">Publish</button></td>
</tr>
</table>
</div>
</body>
</html>
关于javascript - ng-click后如何将值传递给ng-if?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46156591/