Question

当我从服务器返回响应（JSON）时，我想有选择地控制表中的哪些列。

HTML：

<div ng-controller='browserStatsController'>
<select id="searchTypeDropdown" name="searchTypeDropdown"
  ng-model="searchtype" ng-options="s.value as s.name for s in searchtypelist">
</select>
<input name="BrowserStatsBtn" id="BrowserStatsBtn" type="button"
  value="Get Browser Statistics" ng-click="loadBrowserStats()">
<table id="browserDetailView">
    <tr class="DataGridHeading">
        <th>Browser</th>
        <th>Browser Version</th>
        <th>Count</th>
        <th>Percentage</th>
    </tr>
    <tr ng-repeat="stat in browserstats">
        <td>{{stat.BrowserType}}</td>
        <td>{{stat.BrowserVersion}}</td>
        <td>{{stat.Count}}</td>
        <td>{{stat.Percent}}</td>
    </tr>
</table>

在我的JS中，我有：

myApp.controller('browserStatsController', function ($scope, myFactory) {
                $scope.loadBrowserStats = function () {
                    $scope.asyncObj.args.Search.SearchType = $scope.searchtype;
                    myFactory.getStatsAsync(function (callback) {
                        $scope.browserStats = callback.result;
                        $scope.error = callback.error;
                    }, $scope.asyncObj);
                };

                $scope.search = {
                    SearchType: undefined,
                    StartDate: undefined,
                    EndDate: undefined,
                    TimePeriod: undefined
                };

                $scope.searchtypelist = [
                    {
                        name: 'Browsers Only',
                        value: 'b'
                    },
                    {
                        name: 'Browser and Version',
                        value: 'v'
                    }
                ];

                $scope.asyncObj = {
                    method: "GetBrowserStats",
                    args: { Search: $scope.search }
                };
            });

当我将呼叫提交到我的服务器方法时，我正在为正在执行的搜索类型提供一个值（＆＃39; b＆＃39;或＆＃39; v＆＃39;）。这将影响返回的JSON响应的形状：提交的搜索类型为＆＃39; v＆＃39;将获取包含对象内BrowserVersion属性的JSON响应。（参见表格中tr元素的ng-repeat。）搜索类型＆＃39; b＆＃39;不会有这个属性。

因此，我想动态控制浏览器版本是否为＆＃39;列根据搜索类型的值显示在我的表中。我是Angular的新手，所以我不确定如何解决这个问题。你会怎么做？你会动态添加到DOM吗？您是否会使用jQuery（或其他？）来切换表中的列可见性？

今天早上我花了很多时间尝试使用ng-grid。但是，当gridOptions看到数据发生变化时，它开始无休止地消化变化 - 我放弃了试图找出原因。（请求和回复不是无休止地重复......）（Angular 1.2.9）

我需要使用此解决方案在IE 8中运行。（因此Angular 1.2.9 ...）

重复免责声明：我承认我可能会问一个重复的问题。我正在阅读（并试图理解给出的答案）类似的问题，问here。

抱歉，如果我发布了太多代码。（Stackoverflow编辑器正在责备我......）如果我不清楚，请告诉我。或者只是简单的钝。

谢谢！

Answer 1

尝试使用ng-show，甚至更好的ng - 如果可以根据您提供的表达式呈现DOM元素。例如 '＆lt;'ng-if =“showSomethingUnique（）”为th和td执行此操作。

比在你的控制器中创建showSomethingUnique，它会根据你的服务器响应返回一个bool。

AngularJS：动态控制哪些列出现在表中

1 个答案: