Связывание в angularjs и typecript

Question

Я использую устаревшую версию angularjs 1.5 с машинописью.Данные не обновляются в Активная карточка пользователя при изменении в родительском

Родитель

<active-user-card active-users="response.activeUsers"></active-user-card>

Активная карточка пользователя

export class ActiveUserCard {
  activeUsers: number;
  data: Array<IChartData>;

  constructor() {

    ........
    ........
    this.inactiveUsers = (totalUsers - this.activeUsers) || 0;

    this.data = [
      {name: "Active users",   y: this.activeUsers},
      {name: "Inactive users", y: this.inactiveUsers}
    ];
    ........
    ........
  }
}

angular.module('tm')
  .directive('activeUserCard', [function() {
    return {
      restrict: 'E',
      scope: {
        activeUsers: '<'
      },
      bindToController: true,
      controller: ActiveUserCard,
      controllerAs: 'auc',
      templateUrl: "./active-user-card.html"
    };
  }]);

Answer 1

Ну, единственное место, которое вы обновляете data, - это конструктор компонента (так что, запустите один раз).Используйте крючок $onChanges.

https://docs.angularjs.org/guide/component

Answer 2

Прежде всего, если родительские данные используются непосредственно в HTML, они немедленно отражаются с помощью $ watch Angular.

Но здесь вы бы хотели, чтобы изменение было отражено в this.data переменная вашего компонента.Чтобы вы прослушали изменения и затем обновили this.data.

$onChanges(changes) {
    if (changes.activeUsers&& changes.activeUsers.currentValue) {
      // update your code here
      // i don't know where totalusers are comigng in below but you just figure out.
       const inactiveUsers = (totalUsers - changes.activeUsers.currentValue) || 0;

       this.data = [
          {name: "Active users",   y: changes.activeUsers.currentValue},
          {name: "Inactive users", y: inactiveUsers}
      ];
    }
  }

Я бы порекомендовал попробовать повторно использовать код.выньте код из конструктора и сделайте метод для установки данных, который принимает в качестве аргументов общее количество пользователей и активных пользователей и создает данные.Тот же метод должен вызываться из ловушек $ onChanges с помощью changes.activeUsers.currentValue.Так что код будет чистым

Спасибо