質問編集履歴
2
試したことを追加
test
CHANGED
@@ -1 +1 @@
|
|
1
|
-
|
1
|
+
子コンポーネントに渡すデータをサーバーから取得したとき更新が反映されない
|
test
CHANGED
@@ -9,6 +9,18 @@
|
|
9
9
|
データ取得とテーブル表示のコンポーネントを分けない場合に動くことは確認していますが、
|
10
10
|
|
11
11
|
MyDataTableComponent に切り分けてプロパティバインディングでdataを渡すようにした場合に動かないという状況です。渡し方を間違えているのではないかと思いますが良い方法が分かりません。
|
12
|
+
|
13
|
+
|
14
|
+
|
15
|
+
|
16
|
+
|
17
|
+
###試したこと(追記)
|
18
|
+
|
19
|
+
MyDataTableComponent 内でのフィルタ操作をsetTimeoutで1秒後にするなどしたら
|
20
|
+
|
21
|
+
動作したので、dataの更新後にfilterが実行できるようにすればよさそうだということまでは分かりました。
|
22
|
+
|
23
|
+
|
12
24
|
|
13
25
|
|
14
26
|
|
@@ -104,6 +116,8 @@
|
|
104
116
|
|
105
117
|
@Input() data = [];
|
106
118
|
|
119
|
+
filteredData = [];
|
120
|
+
|
107
121
|
|
108
122
|
|
109
123
|
constructor() {}
|
@@ -112,7 +126,23 @@
|
|
112
126
|
|
113
127
|
ngOnInit() {
|
114
128
|
|
129
|
+
// this.filteredData = this.data.filter( x => this.filterFunction(x) );
|
130
|
+
|
131
|
+
setTimeout(
|
132
|
+
|
133
|
+
() => {
|
134
|
+
|
135
|
+
this.filteredData = this.data.filter( x => this.filterFunction(x) );
|
136
|
+
|
137
|
+
console.log( this.data, this.filteredData )
|
138
|
+
|
139
|
+
}, 1000 );
|
140
|
+
|
115
141
|
}
|
142
|
+
|
143
|
+
|
144
|
+
|
145
|
+
filterFunction(x): boolean { return true; }
|
116
146
|
|
117
147
|
}
|
118
148
|
|
1
コメント追加
test
CHANGED
File without changes
|
test
CHANGED
@@ -8,7 +8,7 @@
|
|
8
8
|
|
9
9
|
データ取得とテーブル表示のコンポーネントを分けない場合に動くことは確認していますが、
|
10
10
|
|
11
|
-
MyDataTableComponent に切り分けてプロパティバインディングでdataを渡すようにした場合に動かないという状況です。
|
11
|
+
MyDataTableComponent に切り分けてプロパティバインディングでdataを渡すようにした場合に動かないという状況です。渡し方を間違えているのではないかと思いますが良い方法が分かりません。
|
12
12
|
|
13
13
|
|
14
14
|
|