Как показать товар в зависимости от времени и даты - PullRequest
2 голосов
/ 03 ноября 2019

Так что я работаю над приложением, которое позволяет создавать события, должна отображаться определенная информация о событиях, такая как «Местоположение» и «Координировано», в зависимости от даты, когда пользователь говорит, что хочет, чтобы «дата раскрытия» былаи после этой даты. В настоящее время они отображаются только в «дату раскрытия», а не после этой даты, но это должно быть показано в «дату раскрытия» и после даты раскрытия. Я сделал функцию для проверки сегодняшней даты, и дополнительная информация о событии отображается, если «сегодняшняя дата == раскрыть дату». Я прикрепил изображение того, как оно выглядит в данный момент и как оно должно выглядеть, и я прикрепил еще один с кодом, поскольку было бы слишком много кода, если бы я вставил его сюда.

ps iЯ новичок в угловой, так что я не уверен, что это лучший способ сделать это, дайте мне знать, если я что-то делаю действительно неправильно. Я использую базовое приложение .net в качестве серверного API, куда отправляется информация, которую вводит пользователь. если это невозможно сделать в приложении для внешнего интерфейса, есть ли возможность сделать это в бэкэнд-приложении (указать начальную дату и конечную дату (но конечная дата всегда 'сегодня')

код внешнего интерфейса:

<li class="conditional" *ngIf="event.revealDate == todaysDate">Location: {{event.location | titlecase}}</li>

машинописный код (функция для получения текущей даты):

todaysDate: any;

revealLocation() {
const utc = new Date().toJSON().slice(0,10).replace(/-/g,'-');
console.log(utc);
this.todaysDate = utc;

}

Thisизображение показывает, как оно выглядит в настоящее время и как оно должно выглядеть / Это изображение содержит код и дополнительную информацию

[EDIT]

Итак, я 'Мы внесли некоторые изменения, поэтому, если дата больше или равна дате раскрытия, она покажет информацию, но вместо того, чтобы показывать информацию только для этого события, она покажет информацию для всех событий в массиве.

Машинопись:

  showInfo = false;

  ifDateisAfter(revealDate) {
this.revealLocation();
// this.revealLoction just figures out todaysDate
if (revealDate === this.todaysDate) {
  this.showInfo = true;
} if (revealDate >= this.todaysDate) {
  this.showInfo = true;
} else {
  this.showInfo = false;
}

}

Угловая:

<li class="conditional" *ngIf="showInfo == true">Location: {{event.location | titlecase}}</li>

<button class="btn btn-success" (click)="ifDateisAfter(event.revealDate)">Check Event Info</button>

Вот еще 2 изображения кода и до и послефункция / метод запускается для раскрытия информации на основе даты

Обновлен код с new метод / Что сейчас происходит в приложении

Ответы [ 2 ]

1 голос
/ 04 ноября 2019

Вы не можете использовать showInfo в этом случае, потому что это глобальная переменная, и вы хотите специфическую переменную для каждого события (если я правильно понимаю)

То, что вы должны сделать, это вместо использования showInfoполучить событие из параметра в функции и установить для него атрибут:

Пример:

ifDateIsAfter(event) {
  if (event.revealDate === this.todaysDate {
    event.showInfo = true;
  }
  ...
    event.showInfo = false;
  ...
}

В HTML-коде, который вы используете в ngIf:

<li class="conditional" *ngIf="event.showInfo">Location: {{event.location | titlecase}}</li>

СОВЕТ: Вам не нужно ставить === true

0 голосов
/ 03 ноября 2019

Я думаю, что это потому, что revealDate == todaysDate. Только эта дата соответствует. Вы можете сравнивать даты ( посмотрите ).

Так что просто напишите метод, который возвращает false, если дата "больше", чем сегодня. Затем используйте метод в * ngIf.

...