angularjs之如何使用 Angular js中的服务和 Controller 显示模型类中的第一项

我有模型类 Doctor。该类有一个 WebApi Controller 。我创建了 3 个脚本，即 module.js、service.js、Homecontroller.js。

问题是我想显示模型类中的第一项。我不想重复数据，而是只想显示一个数据(即名字)。并且在下一行中我想显示全名。 我还没有写过全名函数。请回复如何编写全名函数并显示第一个数据

//模型类:Doctor.cs

public class Doctor 
    { 
        public int Id { get; set; } 
        public string Reg_No { get; set; } 
        public string FirstName { get; set; } 
        public string LastName { get; set; } 
        public string Email { get; set; } 
        public string Password { get; set; } 
} 
 
 
Web api controller for Doctor 
 
public class DoctorsAPIController : ApiController 
    { 
        private DigitalHealthWebContext db = new DigitalHealthWebContext(); 
 
        // GET: api/DoctorsAPI 
        public List<Doctor> GetDoctors() 
        { 
            return db.Doctors.ToList(); 
        } 
} 

我有3个脚本

Module.js 
var app = angular.module("docModule", ["ngRoute"]); 
 
Service.js 
app.service('docService', function ($http) { 
 
    this.getDoctors = function () { 
        return $http.get("/api/DoctorsAPI"); 
    } 
}) 
 
 
 
 
homeController.js 
app.controller('homeController', function ($scope, docService) { 
   getFormData(); 
   function getFormData() { 
 var DoctorGet = docService.getDoctors();//The MEthod Call from service 
       DoctorGet.then(function (p1) { $scope.LoadDoctor = p1.data }, 
           function (errorP1) { 
 
               $log.error('failure loading Doctor', errorP1); 
           }); 
   } 
}); 

如果我使用带有 ng-Repeat 的选择 Controller ，我就能够获取数据。

<select ng-model="Dept" class="dropdown form-control" required id="selectControl"> 
                                <option value="" disabled selected>Choose speaciality</option> 
                                <option ng-repeat="Doctor in LoadDoctor" value="{{Doctor.Id}}"> 
                                    {{Doctor.firstName}} 
                                </option> 
                            </select> 

但是如果我编写以下代码，我将无法获取数据

     <div class="doc-details-block" ng-controller="homeController"> 
                    <a href="#" ng-model="LoadDoctor"> 
                        <h2 class="doc-name"> 
                            {{firstName}} 
                        </h2> 
                    </a> 
                </div> 

请您参考如下方法:

这是与尝试通过医生获取数组上的firstName 属性相关的问题。

您可以尝试通过以下脚本来改进它，但最好有专门的属性(property)来存储医生(并且最好有专门的服务电话，因为它更清晰、更快)

    <div class="doc-details-block" ng-controller="homeController"> 
        <a ng-if="LoadDoctor.length > 0" href="#"> 
            <h2 class="doc-name"> 
                {{ LoadDpctor[0].firstName }} 
            </h2> 
        </a> 
    </div>