我想将显示值的格式传递给角度分量。

例如:

format="'(utc, offset) location (tz)'" === '(UTC -04:00) New York (EDT)'


要么

format="'(tz, offset) location'" === '(EDT -04:00) New York'


想法是,将按照给定的格式显示值,包括括号。
我猜测达到此目的的最佳方法是拥有所需格式的数组?
所以给定以下字符串,我如何生成以下数组:

'(utc, offset) location (tz)' === ['(', 'utc-code', 'offset-hours', ')', 'location', '(', 'tz-code', ')'];

'(tz, offset) location' === ['(', 'tz', 'offset', ')', 'location']

最佳答案

您可以使用组件binding传递值。此处,在每个摘要循环中将调用$doCheck,这提供了一个机会来检测绑定并对其进行操作。

我用正则表达式编写了一个简单的逻辑,以输入格式显示数据。希望这种方法可以代替数组方法有所帮助。



angular.module('app',[])
.controller('appCtrl', function($scope){
  $scope.format = '(offset) location (tz)';
})
.component('myComponent', {
  template: '<div>{{$ctrl.formattedValue}}</div>',
  controller: myComponentCtrl,
  bindings: {
    format: '='
  }
});

function myComponentCtrl(/*your DI goes here*/){
  console.log('log from component: format->'+this.format);
  var self = this;
  this.formattedValue = '';

  this.$doCheck = function(){
    var sampleDateObject = {
      tz: 'CDT',
      offset: '-4:00',
      location: 'Chicago',
      year: 2017
    }
    self.formattedValue = self.format.replace(/([a-z]+)/gi, function(match){
      return sampleDateObject[match]?sampleDateObject[match]:match;
    });
  };
}

myComponentCtrl.$inject = [/*your DI goes here as string*/];

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.11/angular.min.js"></script>
<div ng-app="app" ng-controller="appCtrl">
  <my-component format="format"></my-component>
  <my-component format="'(tz, offset) location, year'"></my-component>
</div>

09-11 18:57
查看更多