在使用 Angular JS 进行模板化时使用辅助方法 [英] Using helper methods while templating with Angular JS

问题描述

目前正在将网站从以前的模板转换为 Angular.在我们之前使用的模板过程中，我们能够调用辅助方法来正确显示数据.例如:

<div class="post-info"><span class="posted-date">Posted {{ :~parseDate(CreatedDate) }}</span>&nbsp|&nbsp<span>{{ :ReplyCount }} 回复</span>

这非常好.就模板而言，试图找出一种方法来利用与 Angular 相同类型的功能.有没有可能做类似的事情?如果是这样怎么办?

解决方案

您只需将该方法添加到您的控制器中.像这样:

<span class="posted-date">发布{{parseDate(CreatedDate)}}</span>

然后是控制器:

function MyCtrl($scope){$scope.parseDate = 函数(jsonDate){//日期解析功能返回新解析日期；}}

Currently in the process of converting a website from its previous templating to Angular. In the previous templating process we were using we were able to call helper methods to display data correctly. For instance:

<script type="text/javascript">
$.views.helpers({
    parseDate: function (jsonDate) {
      if (jsonDate != null) {
        var newDate = Utils.PrettyDate(Utils.ConvertJsonDateToJsDate(jsonDate));
        return newDate;
      }
    }
});
</script>


<div class="post-info">
  <span class="posted-date">Posted {{ :~parseDate(CreatedDate) }}</span>
  &nbsp|&nbsp
  <span>{{ :ReplyCount }} Replies</span>
</div>

This was very nice. Trying to figure out a way to utilize the same type of functionality with Angular as far as templating goes. Is it possible to do something similar? If so how?

解决方案

You simply add the method to your controller. Something like this:

<div class="post-info" ng-controller="MyCtrl">
    <span class="posted-date">Posted {{parseDate(CreatedDate)}}</span>
</div>

Then the controller:

function MyCtrl($scope)
{
     $scope.parseDate = function(jsonDate) {
        //date parsing functionality
        return newParsedDate;
     }
}

这篇关于在使用 Angular JS 进行模板化时使用辅助方法的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！