如何根据所选项目显示/隐藏列

Question

我得到了两个块，允许用户从左侧和右侧之间选择项目。另外，该块的底部还有另外一行列。我想做的是，默认情况下该列是隐藏的，如果选中的项目从左到右，它将向用户显示。如果用户从右到左选择相同的项目，则再次隐藏。

enter image description here

JS

data = 0: {id: 1, name: "Admin"},1: {id: 2, name: "Staff"}
$scope.roles = data;
angular.forEach($scope.roles, function (r) {
    if (r.name == 'Sales') {
        $scope.sale_role_id = r.id;
    }
    if (r.name == 'Admin') {
        $scope.admin_role_id = r.id;
    }
});
$scope.show_dd_col = false;


angular.forEach($scope.item.role, function (r) {
    if (r == $scope.admin_role_id || 
     r.includes($scope.admin_role_id)) {
        return $scope.isAdmin = true;
    } else {
        $scope.isAdmin = false;
    }
    return $scope.isAdmin;
})

if($scope.isAdmin === true) {
    $scope.show_dd_col = true;
} else {
    $scope.show_dd_col = false;
}

html

//选择项目栏

<formfield label="@lang('user.role')" label-class="col-sm-3"
          input- class="col-sm-9">
    <select ng-model="item.role" name="role"
            ng-options="role.id as role.name for role in roles"
            opt="roles" required multiple="multiple">
    </select>
</formfield>

//显示并隐藏列

<formfield ng-show="show_dd_col" 
           label="@lang('settings.individual_email')" 
           label-class="col-sm-3" input- class="col-sm-9">
    <select name="user_default_individual_email"
            ng-model="item.individual_email" convert-to-number>
        <option value="1">@lang('app.yes')</option>
        <option value="0">@lang('app.no')</option>
    </select>
</formfield>