2017-02-17 5 views
0

У меня есть несколько строк таблицы, и в последнем столбце соответствующих строк есть две операции, которые могут быть выполнены.Как получить данные по нажатой строке в Angular JS

 <div class="embedded-list-table-wrapper embedded-medium migration-status-list-container"> 
      <table class="list-table embedded-list-table no-truncate-td"> 
       <thead> 
        <tr> 
         <th> 
          <a href="#list-table" class="table-sort table-sort-desc"> 
           <span class="table-sort-text">Account Name</span> 
           <span class="table-sort-indicator"></span> 
          </a> 
         </th> 
         <th> 
          <a href="#list-table" class="table-sort table-sort-desc"> 
           <span class="table-sort-text"># Batches Completed</span> 
          </a> 
         </th> 

         <th style="width:123px;">Actions</th> 
        </tr> 
       </thead> 
       <tbody> 
        <tr ng-repeat="item in vm.items | limitTo : vm.pageSize : (vm.currentPage-1)*vm.pageSize"> 
         <td class="table-link"><a class="ng-binding" href="" target="_blank" ng-click="vm.setTenantId($event)">{{item.accountName}}</a></td> 
         <td class="table-text ng-binding">{{item.completedBatches}}</td> 
         <td class="table-input"> 
          <div class="btn-group"> 
           <div class="dropdown"> 
            <div class="cog dropdown-toggle" ng-click="batch.showSettings = !batch.showSettings"></div> 
            <ul class="dropdown-menu visible" ng-show="batch.showSettings"> 
             <li><span class="dropdown-category">Manage</span></li> 
             <li class=""><a href="" ng-click="vm.removeAccount(item.accountName)">Remove from Panel</a></li> 
             <li class=""><a href="#" ng-click="vm.setEncoreLink()">View</a></li> 
            </ul> 
           </div> 
          </div> 
         </td> 
        </tr> 
       </tbody> 
      </table> 
     </div> 

Теперь эта <a>" in View кнопка перенаправит меня к URL, который будет выглядеть примерно так https://encore.rackspace.com/accounts/<tenant-id>. <tenant-id> выйдет из первого столбца Account Name значения, которое мы можем разделить что-то вроде:

  vm.setEncoreLink = function($event){ 
       debugger; 
       var tenant_id_text = $event.currentTarget.text; 
       var tenant_id = tenant_id_text.substring(tenant_id_text.lastIndexOf("#")+1,tenant_id_text.lastIndexOf(")")); 
       var encoreUrl = "https://encore.rackspace.com/accounts/"+tenant_id; 
       $window.location.href=encoreUrl; 
      } 

Если обеспечиваемый $ события передаются от первого значения столбца. Как получить доступ к этому и передать это для доступа к tenant_id? Или есть другой выход?

+0

Я немного запутался. Где в вашем распоряжении есть tenant_id для начала? Это в том, что вы делаете? – Paul

+0

@Paul нет идентификатора арендатора. Мы должны извлечь его из значения первого столбца. Если мы сможем получить текст значения первого столбца, мы можем передать его функции, мы можем разделить его и получить там. – StrugglingCoder

+1

Почему вы не просто передаете 'item' вашему методу' setEncoreLink', чтобы получить доступ к его свойствам напрямую, не пытаясь сделать некоторые сумасшедшие вещи с помощью '$ event'? Кстати, вы не передаете '$ event' из своего представления, поэтому в методе' setEncoreLink' он всегда будет 'undefined'. – Lex

ответ

2

Хорошо, так что мне кажется, что текст, который вы пытаетесь извлечь, на самом деле '{{item.accountName}}', правильно? Также вы не были на самом деле явно, но из вашего образца кода я предполагаю, что вы пытаетесь выполнить функцию setEncoreLink.

Поэтому, учитывая, что вы можете просто сделать это:

<li class=""><a href="#" ng-click="vm.setEncoreLink(item)">View</a></li>

И тогда ваша функция может быть

vm.setEncoreLink = function(item){ 
       debugger; 
       var tenant_id_text = item.accountName; 
       var tenant_id = tenant_id_text.substring(tenant_id_text.lastIndexOf("#")+1,tenant_id_text.lastIndexOf(")")); 
       var encoreUrl = "https://encore.rackspace.com/accounts/"+tenant_id; 
       $window.location.href=encoreUrl; 
      }