Question

我首先使用Web API和实体框架代码开发Angular项目。我有一个底部有一张桌子的视图。加载视图时，它会回调数据库以加载列表。我在各个位置设置了断点，以确保我从数据库中找回正确的数据并将其追溯到角度控制器中。在控制器中，数据存在，但随后进入以太网。我可以查看响应标头，它就在那里。我有点不知所措。我在WebApiConfig中添加了一些json序列化来处理camel / Pascal案例问题。这是我的观看代码：

    <div class=" nav">
        <div class="span12">
          <h3> Work with Dictionaries </h3>
           <ul class="navbar-nav">
             <li><a ui-sref-active="active" style="margin-right: 25px;" ui-sref="injuriesDict">Injuries Dictionary</a></li>
            <li><a ui-sref-active="active" ui-sref="excercisesDict">Excercise Dictionary</a></li>
         </ul>
         </div>
         </div>

<h3>Patient Entry Form</h3>
<ul class="navbar-nav">
    <li><a ui-sref-active="active" ui-sref="patientEntry">Patient Entry</a></li>    
</ul>

       <div class="container span12">
        <div class="row">
        <h1>Patient Search</h1>
        <form class="form-search horizontal-form" method="POST">
            <label for="lastName">LastName</label>
            <input type="text" class="input-medium" style="margin-bottom: 10px;" id="lastName" name="name">
            <br>
            <label for="ssn">SSN</label>
            <input type="text" class="input-medium" style="margin-left: 40px; margin-bottom: 10px" id="ssn" name="ssn">
            <br>
            <label for="mrn">MRN</label>
            <input type="text" class="input-medium" style="margin-left: 32px; margin-bottom: 20px;" id="mrn" name="mrn">
            <br>
            <button type="button" class="btn btn-default" ng-click="vm.patientSearch();">Search</button>
        </form>
    </div>
    </div>

    <div class="container">
    <div class="row">
        <h2>Patient Results</h2>
        <div ng-controller=" patientSearch as vm">
            <table style="border: 1px;" class="span8">
                <tr>
                    <th>First Name</th>
                    <th>Last Name</th>
                    <th>MRN #</th>
                    <th>SSN</th>
                    <th>Injury Type</th>
                    <th>Injury Date</th>
                </tr>
                <tr>
                    <th>{{vm.firstName}}</th>
                    <th>{{vm.lastName}}</th>
                    <th>{{vm.mrn}}</th>
                    <th>{{vm.ssn}}</th>
                    <th>{{vm.injuryType}}</th>
                    <th>{{vm.injuryDate | date}}</th>
                </tr>
            </table>
        </div> 
    </div>
</div>

这是我的控制器代码

(function() {
    'use strict';
     angular.module('app')
      .controller('patientSearch', ["patientResource", patientSearch]);


    function patientSearch(patientResouce) {
       var vm = this;
        patientResouce.query(function(data) {
        vm.patients = data;

     });
   }
 }());

 I just don't see why it is not loading the table, does anybody see anything drastically wrong with my code?

Answer 1

你可能想要这样的东西：

        <table style="border: 1px;" class="span8">
            <tr>
                <th>First Name</th>
                <th>Last Name</th>
                <th>MRN #</th>
                <th>SSN</th>
                <th>Injury Type</th>
                <th>Injury Date</th>
            </tr>
            <tr ng-repeat="patient in patients">
                <th>{{patient.firstName}}</th>
                <th>{{patient.lastName}}</th>
                <th>{{patient.mrn}}</th>
                <th>{{patient.ssn}}</th>
                <th>{{patient.injuryType}}</th>
                <th>{{patient.injuryDate | date}}</th>
            </tr>
        </table>

假设您希望将患者列表作为表格内容，每个患者记录一行。

Answer 2

您需要使用controllerAs语法（vm.patients）：

<tr ng-repeat="patient in vm.patients">
                <th>{{patient.firstName}}</th>
                <th>{{patient.lastName}}</th>
                <th>{{patient.mrn}}</th>
                <th>{{patient.ssn}}</th>
                <th>{{patient.injuryType}}</th>
                <th>{{patient.injuryDate | date}}</th>
</tr>

为什么我的角度列表不会出现？

2 个答案: