Question

我还是刚接触到角色并想出来，就像我举几个例子一样。我现在要做的是找到一种正确的格式化方法。我有一个Job对象，如下所示：

$scope.Job = {
  "JobUID": 100,
  "FirstName": "Corey",
  "LastName": "Ogburn"
}

在我的页面上，我希望显示如下内容：

<p>Patient Name: {{ Job.LastName + ', ' + Job.FirstName }}</p>

虽然这有效，但我希望有一种方法可以调用一个准备名称的函数。例如，在我的Job对象上有一个GetFullName()函数，然后有一个类似于的模板：

<p>Patient Name: {{ Job.GetFullName() }}</p>

这似乎不起作用。我已经阅读了自定义过滤器，但我不确定这是否是正确的方式。我想我必须通过整个工作，我倾向于在尝试之前找到另一种方法。

如何使用函数准备要在模板中使用的数据？

Answer 1

尝试使用此函数，它应该可以工作：

<p>Patient Name: {{ GetFullName(Job) }}</p>

JS（控制器）：

$scope.GetFullName = function(job) {

    return job.LastName+ ', ' + job.FirstName;
}

Answer 2

有＆＃34;对象＆＃34;在角度，可以帮助您完成您提到的任务＆＃34; 服务＆＃34;或＆＃34; 工厂＆＃34;。它们不仅仅是Javascript类（对象），您稍后可以在控制器中注入它们与使用$scope时所做的不同。

但是为了简化过程，您可以直接在控制器中或在其外部实现类，执行以下操作：

function Job() {

  this.JobUID = 100;
  this.FirstName = "Corey";
  this.LastName= "Ogburn";
 }

Job.prototype.GetFullName = function(){
  return this.LastName + ',' + this.FirstName;
}

$scope.Job = new Job();

然后在您的 HTML 代码：

上

<p>Patient Name: {{ Job.GetFullName() }}</p>

Answer 3

你可以这样做：

JSFIDDLE

$scope.Job = {
   "JobUID": 100,
   "FirstName": "Corey",
   "LastName": "Ogburn"
}

$scope.fullname = function() {
    return $scope.Job.LastName + ", " + $scope.Job.FirstName;
}

标记：

<p>Patient Name: {{ fullname() }}</p>

使用函数的Angular方法导致模板？

3 个答案: