如何在ng-click之后将值传递给ng-if？
如何在ng-click之后将值传递给ng-if？
提问于 2017-09-11 21:11:51
目的
我试图让管理员和客户显示在不同的阶段，管理员可以在点击toggleShowDiv()后张贴数据，这让客户看到的数据。
问题
如何将!isAdmin()传入ng-if？目前，我只将isAdmin作为默认设置。
可以通过TD (逐行)将其发布到表TD中吗？不确定，我在这里写的代码是正确的。
My thought
我是否可以对每个单独的TD = isAdmin()或!isAdmin使用ng-if，并通过单击函数进行控制？
$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()函数，它工作得很好。我想要做的是使用一个单击函数来显示和隐藏表行。
回答 8
Stack Overflow用户
回答已采纳
发布于 2017-09-20 13:32:48
看看这个。这里有两个用户同时在线，dude1 (管理员)和dude2 (非管理员)。您可以从管理员端切换非管理员端的显示，方法是调用后端，不断检查显示是否有效。要在表行上进行切换，只需向<tr>元素添加ng-if。
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>
Stack Overflow用户
发布于 2017-09-18 12:02:29
<div ng-if="showDiv == true || isAdmin == true">
<tbody class="auction-group" ng-repeat="a in foos">
<td ng-if="isAdmin == true">
<input type="checkbox" ng-click="toggleShowDiv()" />
</td>
</div>JS代码让我们先说任何进入的人都将是客户
$scope.showDiv = false;
$scope.isAdmin = false;现在，当响应来自后端时，检查响应并相应地更改$scope.isAdmin的值。
if(response == admin){
$scope.isAdmin= true;
}else{
$scope.isAdmin = false;
}现在在onclick复选框函数中
$scope.toggleShowDiv = function (auction) {
var title = 'text.......';
var text = 'are you sure?';
ConfirmModal(title, text, function () {
if($scope.showDiv == false){
$scope.showDiv = true;
}else{
$scope.showDiv = false;
}
});
};Stack Overflow用户
发布于 2017-09-13 22:35:12
我认为你应该使用一些变量，如果用户点击like $scope.showTable = true /false，这些变量就会改变。但不能完全确定你真正的需求。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/46156591
复制相关文章
相似问题