2017-05-13 42 views
0

我想在HTML中显示数据。第一个HTML disc-log.html的样子如下:在很多html中显示数据不能使用角度

<div> 
    <h2>Discs</h2> 
    <jhi-alert></jhi-alert> 
    <div class="container-fluid"> 
     <div class="row"> 
      <div class="col-xs-4 no-padding-left"> 
       <!--<button class="btn btn-primary" ui-sref="disc.new" >--> 
        <!--<span class="glyphicon glyphicon-plus"></span>--> 
        <!--<span >--> 
         <!--Create new Disc--> 
        <!--</span>--> 
       <!--</button>--> 
      </div> 
     </div> 
    </div> 
    <br/> 
    <div class="table-responsive"> 
     <table class="jh-table table table-striped"> 
      <thead> 
       <tr> 
        <!--<th><span>ID</span></th>--> 
        <th><span>Name</span></th> 
        <th><span>Connection</span></th> 
        <th></th> 
       </tr> 
      </thead> 
      <tbody> 
       <tr ng-repeat="disc in vm.discs track by disc.id"> 
        <!--<td><a ui-sref="disc-detail({id:disc.id})">{{disc.id}}</a></td>--> 
        <td>{{disc.name}}</td> 
        <td> 
         <a ui-sref="connection-detail({id:disc.connection.id})">{{disc.connection.userHost}}</a> 
        </td> 
        <td class="text-right"> 
         <div class="btn-group flex-btn-group-container"> 
          <button type="submit" 
            ui-sref="disc-detail({id:disc.id})" 
            class="btn btn-info btn-sm"> 
           <span class="glyphicon glyphicon-eye-open"></span> 
           <span class="hidden-sm-down"></span> 
          </button> 
          <!--<button type="submit"--> 
            <!--ui-sref="disc.edit({id:disc.id})"--> 
            <!--class="btn btn-primary btn-sm">--> 
           <!--<span class="glyphicon glyphicon-pencil"></span>--> 
           <!--<span class="hidden-sm-down"></span>--> 
          <!--</button>--> 
          <button type="submit" 
            ui-sref="disc.delete({id:disc.id})" 
            class="btn btn-danger btn-sm"> 
           <span class="glyphicon glyphicon-remove-circle"></span> 
           <span class="hidden-sm-down"></span> 
          </button> 
         </div> 
        </td> 
       </tr> 
      </tbody> 
     </table> 
    </div> 
</div> 

打开本网站后,显示所有数据。但是当我将表格复制到另一个文件时,表格是空的。为什么?我应该添加一些东西在控制器或服务?

盘日志控制器:

(function() { 
    'use strict'; 

    angular 
     .module('deviceManagerApp') 
     .controller('DiscLogController', DiscLogController); 

    DiscLogController.$inject = ['$scope', '$state', 'DiscLog']; 

    function DiscLogController ($scope, $state, DiscLog) { 
     var vm = this; 

     vm.discLogs = []; 

     loadAll(); 

     function loadAll() { 
      DiscLog.query(function(result) { 
       vm.discLogs = result; 
       vm.searchQuery = null; 
      }); 
     } 
    } 
})(); 

Github上库: https://github.com/Ice94/DeviceManager

+1

我想你把'NG-controller'在你的模板。 –

+0

你能告诉我你解决这个问题吗?是否可以添加一些标签并在另一个HTML文件中显示这些数据? – Ice

+1

你可以使用'directive'或'ng-template'来代替这个.. –

回答

-1

在控制器,你在discLogs变量vm.discLogs = result;和累加的结果在HTML中使用的是光碟NG重复变量<tr ng-repeat="disc in vm.discs track by disc.id">

这就是为什么它没有显示任何东西尝试使用相同的变量。

注:"yourControllerName as vm"应该在你的NG-控制器属性或在你的路由controllerAs: 'vm'如果使用路由器