Question

我是AngularJS的新手，但我喜欢这个框架。

我现在所拥有的是一个加载json数据的（存根）单页。

JS

var merlinoApp = angular.module('merlino', []);
merlinoApp.controller('mainController', function ($scope, $http) {
   ...
   $http.get('@Url.Action( "consoledatapull", "ConsoleElaborazioni")')
      .then(function (res) {
          $scope.jobs = res.data.jsonjobs;
          $scope.clienti = res.data.jsonclienti;
          $scope.console = res.data.jsonconsole;
      });
   ...
});

HTML

<div ng-repeat="roll in jobs | orderBy:sortType:sortReverse | filter:searchJob | filter:searchCliente | filter:searchStato" class="console-row my-row">
    ...
    <div class="console-cell-id console-cell console-cell-padding console-cell-no-border-sx">{{ roll.id }}</div>
    ...
    <div ng-click="collapsed=!collapsed" ng-class="{'console-cell-esito-selected' : collapsed}" class="console-cell-esito console-cell console-cell-no-border-sx">SHORT DESC</div>
    <div ng-show="collapsed" class="console-cell-esito-long console-cell console-cell-no-border-sx">{{ roll.esito }}</divng-show></div>
</div>

这会填充ng-repeat，ng-click会显示/隐藏`ng-show div。到目前为止一切顺利（？）。

尝试实现的目的是将json数据加载到

中

<div ng-show="collapsed" class="console-cell-esito-long...

如果

<div ng-click="collapsed=!collapsed" ng-class="{'console-cell...

单击

这是ng-repeat的每个div，可以加载特定的数据：

        <ul>
            <li ng-repeat="logelem in jsonlog">
                {{ logelem.log }}
            </li>
        </ul>

我考虑过使用一个函数：

<div ng-click="function(id)...

然后将json加载到由id标识的div中，所以我使用$ index ...
结果是，能够一次将相同的数据加载到所有div中：/

帮助将不胜感激。

Answer 1

我的建议是将信息添加到作业元素本身。

例如，ng-click将成为：

<div ng-click="loadData(id, roll)">CLICK ME</div>

然后loadData类似于：

$scope.loadData = function(id, roll){
    // Do something
    roll.result = result;
}

然后您可以像在其他地方一样使用视图中该对象的result。然后，您可以将对象隐藏在您想要最终结果的位置，直到定义变量result为止。

我认为这将是最简单的解决方案。

从评论中更新

为什么不更改方法中的折叠值？或者您可以使用$watch来收听折叠变量的更改。

Angularjs将json加载到特定的div中

1 个答案: