Question

在My Angular UI Project中，我想根据登录的用户角色显示/隐藏三个按钮。

我进入TabLevelSecurity.cs ... is_approver 字段...文件来自......

public override void OnAuthorization(AuthorizationContext filterContext) {
    try
    {

        IPrincipal p = HttpContext.Current.User;

        string UsrName = string.Empty;
        UsrName = p.Identity.Name;


        if (UsrName.Contains("\\"))
        {
            int index = UsrName.IndexOf("\\");
            UsrName = UsrName.Substring(index + 1);
        }

        //Tab level security configuration entries read from JSON file
        List<Entities.TabLevelSecurityParams> listTabLevelSecurity = new List<Entities.TabLevelSecurityParams>();
        string JsonDeserializeTabLevelUsers = File.ReadAllText(ConfigurationManager.AppSettings["TabLevelSecurityConfigPath"]);
        listTabLevelSecurity = JsonConvert.DeserializeObject(JsonDeserializeTabLevelUsers, (typeof(List<Entities.TabLevelSecurityParams>))) as List<Entities.TabLevelSecurityParams>;

        //Check if the use is authenticated
        if (p.Identity.IsAuthenticated)
        {


            if (listTabLevelSecurity.Exists(x => x.usr_nm.ToString().ToLower() == UsrName.ToLower()))
            {
                TabLevelSecurityCurrentUser = listTabLevelSecurity.AsEnumerable().Where(x => (x.usr_nm.ToString().ToLower() == UsrName.ToLower())).Select(x => x).FirstOrDefault();
            }

            ........
                                if (TabLevelSecurityCurrentUser != null)
            {
                switch (ActionTab)
                {
                    //....

                    case "is_approver": strPermission = TabLevelSecurityCurrentUser.is_approver ?? "N";
                        strAddPermission = TabLevelSecurityCurrentUser.transaction_tb_access ?? "N";
                        break;
                }

基于此is_approver事物（它将设置为1或0）

我将隐藏/显示3个按钮“批准”，“拒绝”，“研究”。

角度模板是......

<div class="home-grid-content" ng-controller="TransactionDetailsMergeController" style="width:100%;">
    <div ng-style="pleaseWait">
        <div class="refresh" style="width:100%;height:100px;">
            <h4>Please wait....</h4>
        </div>
    </div>

    <div class="row" ng-style="toggleMergeButtons">
        <div class="col-lg-12">
            <div style="padding-top:10px; padding-right:10px; float: left;">
                <button type="button" class="btn btn-default" ng-model="ApproveRecords" ng-click="ApproveMerge(ApproveRecords)">Approve</button>
            </div>
            <div style="padding-top:10px; padding-right:10px; float: left;">
                <button type="button" class="btn btn-default" ng-model="RejectRecords" ng-click="RejectMerge(RejectRecords)">Reject</button>
            </div>
            <div style="padding-top:10px;" padding-right:10px; float left;>
                <button type="button" class="btn btn-default" ng-model="ResearchRecords" ng-click="Research(ResearchRecords)">Research</button>
            </div>
        </div>
    </div>

    <br />

    <div ng-style="toggleDetails">

        <div>
            <h3>Merge Details</h3>
            <div ui-grid="gridOptions" ui-grid-selection class="" ui-grid-pagination ui-grid-auto-resize>
                <div class="watermark" ng-show="!gridOptions.data.length">No data available</div>
            </div>

            <div class="grid-pager">
                <uib-pagination boundary-links="true" total-items="totalItems" items-per-page="4" ng-change="pageChanged(currentPage)" ng-show="(totalItems>4) == true"
                                ng-model="currentPage" class="pagination" direction-links="false" id="HconstUnmerge_1"
                                first-text="&laquo;" last-text="&raquo;">
                </uib-pagination>
            </div>
        </div>
        <br />
        <div style="margin-top:8px;">
            <button type="button" class="btn btn-default pull-left" ng-click="backToDetailsPage()">Cancel</button>
        </div>

    </div>

    <div class="modal fade" id="accessDeniedModal" role="dialog">
        <div class="modal-dialog">

            <div class="modal-content">
                <div class="modal-header">
                    <h3 class="modal-title">Transaction Status</h3>
                </div>
                <br />
                <br />

                <div class="row" style="width:98%; ">
                    <div style="margin-left:40px;margin-right:40px;">
                        The Transaction will be posted to CDIM.
                    </div>
                </div>
                <br />

                <div class="modal-footer">
                    <!--<button class="btn btn-default pull-left" ng-click="case.back()"> Back</button>-->
                    <div style="padding-top:10px;">
                        <button class="btn btn-default pull-right" type="button" ng-click="closeTransModal()">OK</button>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="modal fade" id="accessDeniedRejectModal" role="dialog">
        <div class="modal-dialog">

            <div class="modal-content">
                <div class="modal-header">
                    <h3 class="modal-title">Transaction Status</h3>
                </div>
                <br />
                <br />

                <div class="row" style="width:98%; ">
                    <div style="margin-left:40px;margin-right:40px;">
                        The Transaction will not be posted to CDIM.
                    </div>
                </div>
                <br />

                <div class="modal-footer">
                    <!--<button class="btn btn-default pull-left" ng-click="case.back()"> Back</button>-->
                    <div style="padding-top:10px;">
                        <button class="btn btn-default pull-right" type="button" ng-click="closeTransModal()">OK</button>
                    </div>
                </div>
            </div>
        </div>
    </div>

</div>

我怎样才能“在控制器中”？

Answer 1

首先，设置一个名为SecurityVars的全局变量，其中包含用户的权限。您需要一个Security课程来确定用户的权利。

<script type="text/javascript">
    //rights contains an array of privileges a user can do, i.e. is_approver
    var userRights = string.Join("','", Security.CurrentUserRights().Select(r => r.Flag).ToArray());
    var SecurityVars = { Name: '@Html.Raw(Security.CurrentUser.Identity.Name)', Rights: ['@Html.Raw(userRights)'] }
</script>

<强>的Javascript

//setup a global security model
app.run(["$rootScope", function($rootScope){
    $rootScope.security = new security();
}]);

var security = function() {
    this.canApprove = checkApprover();
    this.canReject = checkCanReject();
    this.canResearch = checkCanResearch();

    function checkApprover() { return SecurityVars.Rights.indexOf("is_approver") > -1 ? true : false; }
    function checkApprover() { return SecurityVars.Rights.indexOf("is_rejector") > -1 ? true : false; }
    function checkApprover() { return SecurityVars.Rights.indexOf("is_rejector") > -1 ? true : false; }
}

然后在你的控制器内，你可以这样做：

//attach the rootScope's security to local scope
$scope.security = $rootScope.security;

最后，在HTML中使用安全性。

<强> HTML

<button id="approvePost" ng-disabled="!security.canApprove">Approve</button>

在Angular JS中访问MVC数据模型属性

1 个答案: