加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 综合聚焦 > 服务器 > 安全 > 正文

angular – 如何手动重新渲染组件?

发布时间:2020-12-17 07:54:09 所属栏目:安全 来源:网络整理
导读:我是Angular2的新手,我已经习惯了Angular 1摘要周期,这意味着如果我更新视图的范围,我可以通过调用$scope.$digest()来手动触发摘要.但是,我不确定如何在Angular2中执行此操作,因为新框架没有旧版本具有的隐式数据绑定. 这是我的问题.当有一个带参数的url时,
我是Angular2的新手,我已经习惯了Angular 1摘要周期,这意味着如果我更新视图的范围,我可以通过调用$scope.$digest()来手动触发摘要.但是,我不确定如何在Angular2中执行此操作,因为新框架没有旧版本具有的隐式数据绑定.

这是我的问题.当有一个带参数的url时,我有一个加载组件的路由:

// Router
export const AppRoutes : RouterConfig = [
    {
    path: 'my/:arg/view',component: MyComponent  
    }
]

然后我有这个组件:

// Component
export class MyComponent {
    constructor(private route : ActivatedRoute,private r : Router) {
    let id = parseInt(this.route.params['value'].id);
    console.log(id);
    // do stuff with id
    }

    reloadWithNewId(id:number) {
        this.r.navigateByUrl('my/' + id + '/view');
    }
}

让我们说我导航到url / my / 1 / view.它将调用构造函数并记录数字1.但是,如果我使用新的id reloadWithNewIf(2)调用reloadWithNewId,则不会再次调用构造函数.如何手动重新加载组件?

不需要重新加载组件.只需更新模型,视图就会自动更新:
export class MyComponent {
    constructor(private route : ActivatedRoute,private r : Router) {}

    reloadWithNewId(id:number) {
        this.r.navigateByUrl('my/' + id + '/view');
    }

    ngOnInit() {
      this.sub = this.route.params.subscribe(params => {
         this.paramsChanged(params['id']);
       });
    }

    paramsChanged(id) {
      console.log(id);
      // do stuff with id

    }
}

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读