如何将带有只读列的可编辑表插入angular js的选项卡视图中

Question

我正在使用javascript，bootstrap，angularjs创建具有可编辑选项卡名称的选项卡视图，并带有添加/删除选项卡的选项（已完成）以及每个选项卡中的可编辑表格（可完成）。我很难找到示例，其中在所有选项卡中都放置了带有只读列的动态可编辑表（下面的表屏幕截图示例）。我想知道是否有人实现了类似的示例或有指导性的示例，感谢您的帮助。另外，我还附有每个商店标签的表格视图的屏幕快照，此处所有标签页的第1列都是相同的（只读），第2列中的值是可编辑的，这是指向我的标签视图代码的链接。html<div class="container">  <div class="page-header">    <h1>Stores Window</h1>  </div>  <h3>Actions:</h3>  <ul class="list-unstyled">    <li>Add new stores</li>    <li>Edit store names</li>    <li>Delete stores </li>  </ul></div><div ng-app="tabApp" class="container">  <div ng-controller="MainController" class="tab-container">    <div class="ng-isolate-scope">      <ul class="nav nav-tabs" data-as-sortable="" data-ng-model="tabs">        <li ng-repeat="tab in tabs" data-as-sortable-item  ng-class="tab.active ? 'active' : ''">          <a href="" ng-click="select(tab)" class="ng-binding" data-as-sortable-item-handle>{{tab.title}}</a>        </li>        <li class="uib-tab-last" data-toggle="modal" data-target="#CreateNewTabModal" ng-disabled="!hasLimit">        <a href="#">+ Add New</a>      </li>      </ul>      <div class="tab-content">        <div class="tab-pane" ng-repeat="(index,tab) in tabs" ng-class="tab.active ? 'active' : ''">          <p class="text-right">            <button type="button" ng-click="EditTab(index)" class="btn btn-info">              <i class="glyphicon glyphicon-pencil"></i>            </button>            <button type="button" ng-click="destroyTab(index)" ng-if="tabs.length > 1" class="btn btn-danger">              <i class="glyphicon glyphicon-remove"></i>            </button>          </p>          <p class="text-center ng-scope">{{tab.content}}</p>        </div>      </div>    </div>

Answer 1

Updated your code, Check here

在这里检查您的代码