保存表格格式以在AngularJS中使用不同的值填充

保存表格格式以在AngularJS中使用不同的值填充,angularjs,html,angularjs-material,Angularjs,Html,Angularjs Material,我是UI技术新手。 我正在尝试创建一个带有选项卡的HTML页面,两个选项卡将以相同格式的表格显示不同的数据。是否有一种方法可以保存表格格式,用不同的值填充表格,并为每个选项卡呈现这些值? 感谢您的帮助或提示 这是我的密码: <div ng-cloak="" class="container" ng-app="MyApp" ng-controller="MyAppControler" ng-init="init()"> <h1></h1> <md-c

我是UI技术新手。 我正在尝试创建一个带有选项卡的HTML页面,两个选项卡将以相同格式的表格显示不同的数据。是否有一种方法可以保存表格格式,用不同的值填充表格,并为每个选项卡呈现这些值? 感谢您的帮助或提示

这是我的密码:

<div ng-cloak="" class="container" ng-app="MyApp" ng-controller="MyAppControler" ng-init="init()">
<h1></h1>
   <md-content>
        <md-tabs md-dynamic-height="" md-border-bottom="">
            <md-tab label="Teachers">
                <md-content class="md-padding">
                    <table class="table table-striped" >
                    <colgroup>
                        <col width="" />
                        <col width="" />
                    </colgroup>
                    <thead>
                        <tr>
                            <th width="100">Name</th>
                            <th width="260">Address</th>
                         </tr>
                    </thead>
                    <tbody>
                        <tr ng-repeat="Name in teacherNameList">
                            <td>{{name}}</td>
                            <td>{{Address}}</td>
                        </tr>
                    </tbody>
                    </table>
                </md-content>
            </md-tab>
            <md-tab label="Students">
                <md-content class="md-padding">
                    <table class="table table-striped">
                        <colgroup>
                        <col width="" />
                        <col width="" />
                    </colgroup>
                    <thead>
                        <tr>
                            <th width="100">Name</th>
                            <th width="260">Address</th>
                         </tr>
                    </thead>
                    <tbody>
                        <tr ng-repeat="Name in studentNameList">
                            <td>{{name}}</td>
                            <td>{{Address}}</td>
                        </tr>
                    </tbody>
                    </table>
                </md-content>
            </md-tab>
        </md-tabs>
    </md-content>

名称
地址
{{name}}
{{地址}
名称
地址
{{name}}
{{地址}

您可以将其作为组件,然后将项集合作为参数传递。通常我不会像这样内联定义模板(除非它是一个非常简单的模板),而是将它放在自己的HTML文件中。这可能不是您所需要的,但应该让您了解如何使用组件。我使用了单向绑定(
使表成为一个组件,然后将项集合作为参数传递。有关于如何在控制器和html中组织它的代码吗