目的
我正在尝试在不同阶段获得管理员和客户展示，管理员可以在点击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()功能，它运行正常。我想要做的是使用单击功能来显示和隐藏表格行。
答案 0 :(得分：9)
看看这个。这里你有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>
答案 1 :(得分：4)
<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;
}
});
};
答案 2 :(得分：2)
嗯，我认为如果用户点击如$ scope.showTable = true / false，你应该使用一些变化。但不能完全确定你的真正需求。
答案 3 :(得分：2)
而不是ng-if="showDiv"使用链接ng-if="obj.showDiv"
在控制器中定义$scope.obj = {};
问题是ng-if创建了自己的范围，所以总是将数据作为对象传递，因为JS中的对象是通过引用传递的。
答案 4 :(得分：2)
我对你的问题很困惑 - 我会建议几点，我希望它能帮到你 -
ng-if是一个内置指令。您可以在任何DOM元素上使用它。您可以使用属性或函数来控制它，只需要将Boolean属性传递给此指令。例如：
ng-if="showHideAttribute"或ng-if="functionNameWhichReturnBoolean()"
范围 - 如果您点击按钮/复选框/ ng-click应用的元素在应用的ng-if指令的相同范围内可用，那么没问题。否则你需要使用服务或观察者（在/ emit / broadcast）或rootScope，然后才能使用它。
我希望您在函数中从后端收到isAdmin = true/false。所以，我认为这是范围问题。
答案 5 :(得分：2)
你可以这样做
ng-if =＆＃34; isAdmin == false＆＃34;
答案 6 :(得分：1)
你真的很困惑我，但如果我理解正确，你会想要这样吗？
首先，你的HTML真的很可怕，div中的部分表格？不要那样做......
其次，不要用isAdmin破解kabout以切换事物
isAdmin只应用于检查用户是否为管理员。
但是，您可以创建另一个实例化为相同值的变量，并使用该变量来切换内容。
var app = angular.module('plunker', []);
app.controller('MainCtrl', function($scope) {
this.content = 'This is some unpublished content, only the admin can view, unless you\'ve now gone and publish it.';
this.isPublished = false;
this.isAdmin = false;
});/* Put your css in here */
textarea,
label,
button {
display: block;
margin: 15px 15px 0 0;
}
button {
display: inline-block;
}<script data-require="angular.js@1.5.x" src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.11/angular.min.js" data-semver="1.5.11"></script>
<div ng-app="plunker">
<div ng-controller="MainCtrl as $ctrl" ng-init="$ctrl.isAdmin=false">
<article>
<section class="content">
<section ng-if="$ctrl.isAdmin || $ctrl.isPublished">{{ $ctrl.content }}</section>
<section ng-if="!$ctrl.isAdmin && !$ctrl.isPublished"><pre>-- no published content found --</pre></section>
</section>
<section class="admin-only" ng-if="$ctrl.isAdmin">
<label><input type="checkbox" ng-model="$ctrl.isPublished"> publish article</label>
</section>
</article>
<hr />
<label><input type="checkbox" ng-model="$ctrl.isAdmin"> is admin</label>
</div>
</div>
修改
你仍然让我感到困惑，但这会更接近你想要/需要的吗？
答案 7 :(得分：1)
我的理解是，“当管理员触发某些操作即ng-click时，用户应该能够看到该数据/更改。”
如果是这种情况，请考虑以下事项：
如果您有任何疑问，请与我们联系。
由于