Текущая дата не отображается после вскрытия моего кода в шаблоне - PullRequest
Новая
       30

Текущая дата не отображается после вскрытия моего кода в шаблоне

1 голос
/ 18 апреля 2019

Я показываю текущий date.it работает нормально, когда я помещаю это в index.html.Но когда я разбиваю код в компонентах и ​​шаблонах, он не отображает дату в моем представлении.

Я пытался показать это с помощью {{date |date: "EEE MMM dd yyyy"}}

и в моей области видимости объекта контроллера у меня есть this.date = new Date (), это работает только в index.html

Component 

angular.
  module('cListApp').
  component('itemsList', {
    templateUrl:'items-list.template.html',
    controller: function cListController() {
      this.items = [
        {
            name: 'Nexus S',
            snippet: 'Fast just got faster with Nexus S.',
            icon: 'https://picsum.photos/100/100/?image=491',
            placeholderImage : 'https://picsum.photos/100/100/?blur',
        },
      ],
      this.date = new Date();
    }
  });

Шаблон 

<ul> 
    <li class="list-body-container" ng-repeat="item in $ctrl.items"> 
        <div class="profileImage"> 
            <img ng-src = "{{item.icon || item.placeholderImage}}"/>
        </div> 
        <div class="list-body-left"> 
            <div class="li-title"><h2>{{item.name}}</h2><h4>Title3</h4></div> 
            <div class="li-body"><p>{{item.snippet}}</p></div> 
            <div class="li-date"> 
                {{date | date:"EEE MMM dd yyyy"}}
            </div>
        </div>
    </li>
</ul>

1 Ответ

1 голос
/ 18 апреля 2019

Я обновил свой код.Контроллер 

angular.
  module('cListApp').
  component('itemsList', {
    templateUrl:'items-list.template.html',
    controller:['$http', function cListController($http) {
        var self = this;
        self.date = new Date();
        $http.get('data/data.json').then(function(response) {
          self.items = response.data; 
        });
      }]
  });

Шаблон 

<ul> 
    <li class="list-body-container" ng-repeat="item in $ctrl.items"> 
        <div class="profileImage"> 
            <img ng-src = "{{item.icon || item.placeholderImage}}"/>
        </div> 
        <div class="list-body-left"> 
            <div class="li-title"><h2>{{item.name}}</h2><h4>Title3</h4></div> 
            <div class="li-body"><p>{{item.snippet}}</p></div> 
            <div class="li-date"> 
                {{$ctrl.date | date:"EEE MMM dd yyyy"}}
            </div>
        </div>
    </li>
</ul>
...