刷新角度2+中的同级组件的视图

时间:2018-08-31 03:31:27

标签: angular

我有2个同级组件,第一个具有创建表单,而另一个则显示结果。它们都显示在父组件(仪表板)上。当我在第一个组件中提交数据(创建新任务)时,成功后,我从第二个组件调用ngOnInit()函数。它被触发,数据已加载,但由于某些原因视图未刷新。为什么?有什么想法吗?

表单组件如下:

    2018-08-31 03:20:54.933 UTC [cauthdsl] func2 -> DEBU 0ee 0xc4200b20b8 principal evaluation succeeds for identity 0
2018-08-31 03:20:54.933 UTC [cauthdsl] func2 -> DEBU 0ef 0xc4200b20b8 signed by 1 principal evaluation starts (used [true])
2018-08-31 03:20:54.933 UTC [cauthdsl] func2 -> DEBU 0f0 0xc4200b20b8 skipping identity 0 because it has already been used
2018-08-31 03:20:54.933 UTC [cauthdsl] func2 -> DEBU 0f1 0xc4200b20b8 principal evaluation fails
2018-08-31 03:20:54.933 UTC [cauthdsl] func1 -> DEBU 0f2 0xc4200b20b8 gate 1535685654932879190 evaluation succeeds
2018-08-31 03:20:54.933 UTC [policies] Evaluate -> DEBU 0f3 Signature set satisfies policy /Channel/Orderer/Ordererdpm/Writers
2018-08-31 03:20:54.933 UTC [policies] Evaluate -> DEBU 0f4 == Done Evaluating *cauthdsl.policy Policy /Channel/Orderer/Ordererdpm/Writers
2018-08-31 03:20:54.933 UTC [policies] Evaluate -> DEBU 0f5 Signature set satisfies policy /Channel/Orderer/Writers
2018-08-31 03:20:54.933 UTC [policies] Evaluate -> DEBU 0f6 == Done Evaluating *policies.implicitMetaPolicy Policy /Channel/Orderer/Writers
2018-08-31 03:20:54.933 UTC [policies] Evaluate -> DEBU 0f7 Signature set satisfies policy /Channel/Writers
2018-08-31 03:20:54.933 UTC [policies] Evaluate -> DEBU 0f8 == Done Evaluating *policies.implicitMetaPolicy Policy /Channel/Writers
2018-08-31 03:20:54.933 UTC [common/configtx] addToMap -> DEBU 0f9 Adding to config map: [Group]  /Channel
2018-08-31 03:20:54.934 UTC [common/configtx] addToMap -> DEBU 0fa Adding to config map: [Group]  /Channel/Application
2018-08-31 03:20:54.934 UTC [common/configtx] addToMap -> DEBU 0fb Adding to config map: [Group]  /Channel/Application/Ordererdpm
2018-08-31 03:20:54.934 UTC [common/configtx] addToMap -> DEBU 0fc Adding to config map: [Value]  /Channel/Consortium
2018-08-31 03:20:54.934 UTC [common/configtx] addToMap -> DEBU 0fd Adding to config map: [Group]  /Channel
2018-08-31 03:20:54.934 UTC [common/configtx] addToMap -> DEBU 0fe Adding to config map: [Group]  /Channel/Application
2018-08-31 03:20:54.934 UTC [common/configtx] addToMap -> DEBU 0ff Adding to config map: [Group]  /Channel/Application/Ordererdpm
2018-08-31 03:20:54.934 UTC [common/configtx] addToMap -> DEBU 100 Adding to config map: [Value]  /Channel/Application/Ordererdpm/AnchorPeers
2018-08-31 03:20:54.934 UTC [common/configtx] addToMap -> DEBU 101 Adding to config map: [Value]  /Channel/Application/Capabilities
2018-08-31 03:20:54.934 UTC [common/configtx] addToMap -> DEBU 102 Adding to config map: [Value]  /Channel/Application/ACLs
2018-08-31 03:20:54.934 UTC [common/configtx] addToMap -> DEBU 103 Adding to config map: [Policy] /Channel/Application/Admins
2018-08-31 03:20:54.934 UTC [common/configtx] addToMap -> DEBU 104 Adding to config map: [Policy] /Channel/Application/Readers
2018-08-31 03:20:54.934 UTC [common/configtx] addToMap -> DEBU 105 Adding to config map: [Policy] /Channel/Application/Writers
2018-08-31 03:20:54.934 UTC [common/configtx] addToMap -> DEBU 106 Adding to config map: [Value]  /Channel/Consortium
2018-08-31 03:20:54.934 UTC [common/configtx] verifyDeltaSet -> DEBU 107 Processing change to key: [Policy] /Channel/Application/Readers
2018-08-31 03:20:54.934 UTC [orderer/common/broadcast] Handle -> WARN 108 [channel: userchannel] Rejecting broadcast of config message from 172.23.0.6:57278 because of error: error authorizing update: error validating DeltaSet: attempt to set key [Policy] /Channel/Application/Readers to version 0, but key is at version 0
2018-08-31 03:20:54.934 UTC [orderer/common/server] func1 -> DEBU 109 Closing Broadcast stream
2018-08-31 03:20:54.936 UTC [grpc] Printf -> DEBU 10a transport: http2Server.HandleStreams failed to read frame: read tcp 172.23.0.3:7050->172.23.0.6:57278: read: connection reset by peer
2018-08-31 03:20:54.936 UTC [common/deliver] Handle -> WARN 10b Error reading from 172.23.0.6:57276: rpc error: code = Canceled desc = context canceled

用于显示的组件,像这样:

import { DisplayDataComponent } from '..'

@Component({   
selector: '.....',   
templateUrl: '...',   
styleUrls: ['....'],   
providers: [ DisplayDataComponent ] }) 

export class FormComponent implements OnInit {

          constructor(
            private displayComponent: DisplayDataComponent,   ) {

          refreshDisplayComp() {
            this.displayComponent.ngOnInit();  // <--- and its being triggered...
          }



         formSubmitingFunction(data) { 
              this.someservice.submitData(data).subscribe(res => {
                 this.refreshDisplayComp() 
             }, err => {
                 ...
            })
         }
     }

显示数据的HTML部分

  @Component({   
    selector: '.....',   
    templateUrl: '...',   
    styleUrls: ['....'],   

    export class DisplayDataComponent implements OnInit {
            data = [];


              constructor(
                ) {

              ngOnInit() {
                  loadData();
              }



             loadData() { 
                  this.someservice.getData().subscribe(res => {
                     this.data = res.data;
                     console.log(this.data) // <--- it shows data is loaded but not displayed?
                 }, err => {
                     ...
                })
             }
         }

来自该显示数据组件的日志: enter image description here 第一个数组是初始ngOnInit(),第二个数组是成功创建后的数组。因此,它已调用,已加载但未显示

2 个答案:

答案 0 :(得分:0)

尝试将加载数据功能变成箭头功能,这样您就知道这将是您的组件而不是您的服务。

loadData = () => { 
              this.someservice.getData().subscribe(res => {
                 this.data = res.data;
                 console.log(this.data) // <--- it shows data is loaded but not displayed?
             }, err => {
                 ...
            })
         };

您需要了解这是如何与普通函数和箭头函数绑定的。

答案 1 :(得分:0)

正如@Andreas所建议的,由于某种原因,这种方法不起作用。令我感到困惑的是为什么我什至还能触发功能。我猜它被视为服务。无论如何,按照他离开的link中的说明设法使它起作用(情况1)。我不会复制我的代码,因为它很混乱,而且我花时间写一个虚拟的代码。.但是在此github link上,您确实有这个意思,因此请遵循它。